html使用4種方式引用css樣式表的案例詳細說明
發表時間:2024-05-11 來源:明輝站整理相關軟件相關文章人氣:
[摘要]方法一: css1.html<html><head><title>內聯樣式(方法一)</title></head><body><a href=”http://www.baidu.com” style=”color:#FF...
方法一: css1.html
<html>
<head>
<title>內聯樣式(方法一)</title>
</head>
<body>
<a href=”http://www.baidu.com” style=”color:#FF00FF; font-size:80;”>百度一下</a>
</body>
</html>
方法二: css2.html
<html>
<head>
<title>style標簽中調用(方法二)</title>
<style type=”text/css”>
a{color:#FF0000;background:#FFFF00;}
</style>
</head>
<body>
<a href=”http://www.baidu.com“>百度二下</a>
</body>
</html>
方法三: css3.html
<html>
<head>
<title>link標簽中調用(方法三)</title>
<link rel=stylesheet type=”text/css” href=”three.css”/>
</head>
<body>
<a href=”http://www.baidu.com“>百度三下</a>
</body>
</html>
和css3.html同目錄下的three.css文件: a{color:#FF00FF; background:#0000FF;}
方法四: css4.html
<html>
<head>
<title>@import指令(方法四)</title>
<style type=”text/css”>
@import url(“four.css”);
</style>
</head>
<body>
<a href=”http://www.baidu.com“>百度四下</a>
</body>
</html>
和css4.html同目錄下的four.css文件: a{color:#0000FF; background:#FF00FF;}
**********************************************************************************************
在實際應用中,使用style屬性的內聯樣式是不推薦使用的,不建議使用第一種方式,這種方式削弱了CSS集中控制整個文檔外觀的優點。
前3種方式利用了link標記和style標記,在IE(包括IE6、IE7和IE8 beta1)中有如下限制:
◆ 文檔中只有前31個link或style標記關聯的CSS能夠應用;從第32個開始,其標記關聯的CSS都將失效。
◆ 一個style標記只有前31次@import指令有效應用;從第32個@import指令開始忽略。
◆ 一個css文件只有前31次@import指令有效應用;從第31個@import指令開始忽略。
◆ 一個CSS文件的不能超過288kb。
IE對CSS的限制在絕大部分情況下是不會遇到的,即使遇到最佳的解決方案也應該是手動或者通過后端程序對CSS文件和響應的標記進行合并,
最小化的http請求數是優化頁面呈現的第一原則
以上就是html使用四種方式引用css樣式表的實例詳解的詳細內容,更多請關注php中文網其它相關文章!
網站建設是一個廣義的術語,涵蓋了許多不同的技能和學科中所使用的生產和維護的網站。