CSS選擇器的優先權順序

2020/05/06閱讀時間約 1 分鐘

CSS提供許多選擇器類型，當使用不同的選擇器時，套用樣式的優先權也會不同。

A.元素內的(行內)樣式>頁面內的(崁入)樣式>外部載入(串連)

例子：

例子：

例子：

最後設定的樣式將蓋過之前設定的樣式

例子：

最後會套用的屬性是width:250px; height:50px; background:#fff;

由於 id 具有不可重複性，而class則是可重複的，所以 id 在層級上大於 class，如果一個元素同時有 id 跟 class 兩種屬性，且互有所衝突時，id 優先權大於 class。

!important 的作用為強制提高優先權，照理說越後面設定的越優先，但若使用了 !important，會使得最前面的設定成了最優先，使用!important的 CSS 樣式幾乎等於無敵。

為什麼會看到廣告

哩老師

現職：精誠資訊恆逸教育訓練中心專任多媒體設計資深講師專長：精通多媒體網頁視覺設計、平面設計與多媒體整合應用、Photoshop影像處理、網站視覺設計、Illustrator向量繪圖、Animate動畫效果設計、Dreamweaver網頁互動效果、Dreamweaver資料庫整合及RWD等。

留言0

查看全部

發表第一個留言支持創作者！