文章摘抄?
http://www.cnblogs.com/xugang/archive/2010/09/24/1833760.html
?
一般情況下，優先級如下：
（外部樣式） External style sheet < （內部樣式） Internal style sheet < （內聯樣式） Inline style
?
?
解釋：
1. ?內聯樣式表的權值最高 1000；
?
2. ?ID 選擇器的權值為 100
?
3. ?Class 類選擇器的權值為 10
?
4. ?HTML 標簽選擇器的權值為 1
?
<html>
<head>
<style type="text/css">
#redP p {
/* 權值 = 100+1=101 */
color:#F00; /* 紅色 */
}
#redP .red em {
/* 權值 = 100+10+1=111 */
color:#00F; /* 藍色 */
}
#redP p span em {
/* 權值 = 100+1+1+1=103 */
color:#FF0;/*黃色*/
}
</style>
</head>
<body>
<div id="redP">
<p class="red">red
<span><em>em red</em></span>
</p>
<p>red</p>
</div>
</body>
</html>
?
CSS 優先級法則：
?
A ?選擇器都有一個權值， 權值越大越優先 ；
?
B ?當權值相等時，后出現的樣式表設置要優于先出現的樣式表設置；
?
C ?創作者的規則高于瀏覽者：即網頁編寫者設置的CSS 樣式的優先權高于瀏覽器所設置的樣式；
?
D ? 繼承的CSS 樣式不如后來指定的CSS 樣式；
?
E ? 在同一組屬性設置中標有“!important”規則的優先級最大；
示例如下：
?
<html>
<head>
<style type="text/css">
#redP p{
/*兩個color屬性在同一組*/
color:#00f !important; /* 優先級最大 */
color:#f00;
}
</style>
</head>
<body>
<div id="redP">
<p>color</p>
<p>color</p>
</div>
</body>
</html>
?
IE 瀏覽器下載或者渲染的順序可能如下：
?
● ? IE 下載的順序是從上到下；
?
● ? JavaScript 函數的執行會阻塞IE 的下載；
?
● ? IE 渲染的順序也是從上到下；
?
● ? IE 的下載和渲染是同時進行的；
?
● ? 在渲染到頁面的某一部分時，其上面的所有部分都已經下載完成（但并不是說所有相關聯的元素都已經下載完。）
?
● ? 在下載過程中，如果遇到某一標簽是嵌入文件，并且文件是具有語義解釋性的（例如：JS腳本，CSS樣式），那么此時IE的下載過程會啟用單獨連接進行下載。并且在下載后進行解析，如果JS、CSS中如有重定義，后面定義的函數將覆蓋前面定義的函數。
?
● ? 解析過程中，停止頁面所有往下元素的下載。樣式表文件比較特殊，在其下載完成后，將和以前下載的所有樣式表一起進行解析，解析完成后，將對此前所有元素（含以前已經渲染的）重新進行樣式渲染。并以此方式一直渲染下去，直到整個頁面渲染完成。
?
● ? Firefox 處理下載和渲染的順序大體相同，只是在細微之處有些差別，例如：iframe 的渲染。
?
?
?
?
?
?
?
?
?
?
?
?
?
?
?
?
?
?
?
?
?
?
?
?
更多文章、技術交流、商務合作、聯系博主
微信掃碼或搜索：z360901061
微信掃一掃加我為好友
QQ號聯系： 360901061
您的支持是博主寫作最大的動力，如果您喜歡我的文章，感覺我的文章對您有幫助，請用微信掃描下面二維碼支持博主2元、5元、10元、20元等您想捐的金額吧，狠狠點擊下面給點支持吧，站長非常感激您！手機微信長按不能支付解決辦法：請將微信支付二維碼保存到相冊，切換到微信，然后點擊微信右上角掃一掃功能，選擇支付二維碼完成支付。
【本文對您有幫助就好】元
