CSS樣式表優先順序

2022-04-02 08:42:34 字數 680 閱讀 8560

使用css樣式表一共有2種方式:內部和外部,其中內部分為行內樣式和嵌入式,外部分為匯入式和鏈結式。

如果需要在不同的方式中設定同乙個屬性的時候,樣式的優先級別就出現了。

測試**如下:

red.css:

p test.html:

文字顏色

此時,顯示文字顏色為灰色,說明行內樣式優先級別最高:

去掉行內樣式之後,顯示為藍色,說明頁面嵌入式樣式的優先順序是僅次於行內樣式的:

以上說明頁面內部樣式的優先級別是高於外部樣式的。使用外部樣式又有兩種方式,分為匯入式和鏈結式。

增加乙個樣式表:green.css

p 分以下兩種情況:

情況a:

情況b:

經過嘗試後發現,外部樣式以最後的樣式為準。

經過上述測試,可以總結如下:

但是,是不是所有的情況都是如此呢?

將head中的樣式**改為下面的**:

此時顯示的字型顏色為紅色:

再例如:

此時顯示字型顏色還是為紅色,此時的優先順序為:匯入樣式 > 鏈結樣式 > 嵌入樣式。因此,如果是中存在多個標記,那麼這些樣式的先後順序決定了優先級別,而同一 個內部,才會遵循嵌入樣式優先於匯入樣式的規則。

雖然各種使用方法有不同的優先順序,但是在寫樣式的時候,最好只採用1~2種方式,這樣利於後期的維護和管理,也不會出現樣式衝突的情況。

css選擇器優先順序 樣式表優先順序

css三大特性 繼承 優先順序層疊css選擇器優先順序 選擇器 權重 萬用字元 0 標籤名,偽元素 1 類 偽類 屬性 10 id 100 行內樣式 1000 important 1 0 無窮大 總結排序 important 行內樣式 id 類 偽類 屬性 標籤名,偽元素 萬用字元 繼承 瀏覽器預設...

樣式表優先順序順序

1 最高優先順序的位置是html文件頭部的元素。2第二優先順序的位置是元素中 import語句所匯入的樣式表。3第三優先順序的位置是元素附加的樣式表 4第四優先順序的位置是元素附加的樣式表中的 import語句所匯入的樣式表 5第5優先順序的位置是終端使用者附加的樣式表 有一種例外情況是終端使用者樣...

CSS樣式表的建立和優先順序

1 css樣式表的建立 方法一 內部樣式表 巢狀到頁面中 語法 說明 使用style標記建立樣式時,最好將該標記寫在之間 方法二 內聯樣式 行間樣式,行內樣式,嵌入式樣式 語法 css語句 方法三 引用外部樣式表檔案 用得最多 步驟1 外部樣式表的建立 是個css檔案 charset utf 8 c...