css樣式優先順序詳解

2021-07-28 21:48:14 字數 537 閱讀 4265

很多人在寫**的過程中會出現css樣式衝突的情況,那麼我們怎樣才能應用我們想用的樣式,下面就個人經驗寫了一點總結!

1.權值(瀏覽器是根據權值來判斷使用哪種css樣式的,哪種樣式權值高就使用哪種樣式)

①標籤的權值是 1;

②類(class)選擇器的權值是 10 ;

③id選擇器的權值是 100 ;

④偽元素(:first-child)權值是 1 ;

⑤偽類(:link)權值是 10;

示例如下:

2.當兩個樣式權值相等時,就要通過就近原則比較(與被設定的元素越近優先順序越高)

內嵌樣式(標籤內部)> 內部樣式表(當前html中)> 鏈入外部樣式表(html之外)

3.當多層繼承樣式發生衝突的時候,距離被設定元素最近的父級優先。

ps:新手初學習,若有錯誤或者漏缺,望指出,謝謝!!!

CSS樣式的優先順序詳解

css樣式的優先順序詳解 樣式優先順序 由上到下,由外到內。優先順序由低到高。示例 建立style.css檔案 charset utf 8 p 建立style1.css檔案 charset utf 8 p divp 建立html檔案 doctype html html head meta chars...

css樣式優先順序

多重樣式將層疊為乙個 樣式表允許以多種方式規定樣式資訊。樣式可以規定在單個的 html 元素中,在 html 頁的頭元素中,或在乙個外部的 css 檔案中。甚至可以在同乙個 html 文件內部引用多個外部樣式表。層疊次序 當同乙個 html 元素被不止乙個樣式定義時,會使用哪個樣式呢?一般而言,所有...

CSS樣式優先順序

css樣式分為內聯樣式和外部樣式,一般情況下 內聯樣式的優先順序大於外部樣式。即style樣式 id選擇器 class選擇器 元素選擇器。例如 on person num li當對li標籤新增上面兩個樣式時,on樣式中重複的內容是不會生效的。因為.on樣式的優先順序值小於li,它會被li樣式覆蓋。但...