css樣式沖突


CSS控制頁面樣式四種方法:

1、行內方式
行內方式是4種樣式中最直接最簡單的一種,直接對HTML標簽適用style=”",例如:
<p style=”color:#F00; background:#CCC; font-size:12px;”></p>
雖然這種方法比較直接,在制作頁面的時候需要為很多的標簽設置style屬性,所以會導致HTML頁面不夠純凈,文件體積過大,不利於搜索蜘蛛爬行,從而導致后期維護成本高。

2、內嵌方式
內嵌方式就是將CSS代碼寫在<head></head>之間,並且用<style></style>進行聲明,例如:
<style type=”text/css”>
<!–
#div1{width:64px; height:64px; float:left;}
#div1 img{width:64px; height:64px;}
–>
</style>

3、鏈接方式
鏈接方式是使用頻率最高,最實用的方式,只需要在<head></head>之間加上
<link href=”style.css” type=”text/css” rel=”stylesheet” />
,就可以了,這種方式將HTML文件和CSS文件徹底分成兩個
或者多個文件,實現了頁面框架HTML代碼與美工CSS代碼的完全分離,使得前期制作和后期維護都十分方便,並且如果要保持頁面風格統一,只需要把這些公共的CSS文件單獨保存成一個文件,其他的頁
面就可以分別調用自身的CSS文件,如果需要改變網站風格,只需要修改公共CSS文件就OK了,相當的方便,這才是我們xHTML+CSS制作頁面提倡的方式。

4、導入方式
導入樣式和鏈接樣式比較相似,采用import方式導入CSS樣式表,在HTML初始化時,會被導入到HTML文件中,成為文件的一部分,類似第二種內嵌方式。

四種樣式的優先級別是(從高至低):行內樣式、內嵌樣式、鏈接樣式、導入樣式

備注:
1、同一規則(id與id相比較、class與class相比較)的樣式,按書寫的順序,后面的優先級高於前面。
2、同一規則(id與id相比較、class與class相比較)的樣式,外部引入的樣式,優先級高於內聯樣式(<style>.ss{}</style>)。
3、同一規則(id與id相比較、class與class相比較)的樣式,按書css外部文件引入的順序,后面的優先級高於前面。
在做頁面布局時,為了解決css的沖突,我們可以根據樣式引入的順序,來解決css沖突。

新添加的樣式可使用 !important,以覆蓋前面的樣式。


免責聲明!

本站轉載的文章為個人學習借鑒使用,本站對版權不負任何法律責任。如果侵犯了您的隱私權益,請聯系本站郵箱yoyou2525@163.com刪除。



 
粵ICP備18138465號   © 2018-2025 CODEPRJ.COM