前端面試題-CSS優先級

余學文發布于2019-08-30 14:09 / 1120人閱讀

摘要：優先級是基于不同種類選擇器組成的匹配規則。但是，在內部聲明的選擇器是會影響優先級。當兩條相互沖突的帶有規則的聲明被應用到相同的元素上時，擁有更大優先級的聲明將會被采用。擴展閱讀前端面試題選擇器

一、選擇器優先級

瀏覽器通過優先級來判斷哪一些屬性值與一個元素最為相關，從而在該元素上應用這些屬性值。優先級是基于不同種類選擇器組成的匹配規則。

二、優先級計算

優先級就是分配給指定的CSS聲明的一個權重，它由匹配的選擇器中的每一種選擇器類型的數值決定。

而當優先級與多個CSS聲明中任意一個聲明的優先級相等的時候，CSS中最后的那個聲明將會被應用到元素上。

當同一個元素有多個聲明的時候，優先級才會有意義。因為每一個直接作用于元素的CSS規則總是會接管/覆蓋（take over）該元素從祖先元素繼承而來的規則。

三、優先級順序 3.1 選擇器權重值

3.2 從大到小

內聯樣式 > ID 選擇器 > 類選擇器 = 屬性選擇器 = 偽類選擇器 > 元素（類型）選擇器 = 偽元素選擇器

3.2 注意

通配選擇符（universal selector）(*), 關系選擇符（combinators） (+, >, ~, " ") 和否定偽類（negation pseudo-class）(:not()) 對優先級沒有影響。（但是，在 :not() 內部聲明的選擇器是會影響優先級）。

四、特殊的 !important 規則 4.1 說明

當在一個樣式聲明中使用一個 !important 規則時，此聲明將覆蓋任何其他聲明。雖然技術上 !important 與優先級無關，但 !important 卻又與 CSS 優先級直接相關。

4.2 破壞級聯規則

使用 !important 是一個壞習慣，應該盡量避免，因為這破壞了樣式表中的固有的級聯規則 使得調試找 bug 變得更加困難了。當兩條相互沖突的帶有 !important 規則的聲明被應用到相同的元素上時，擁有更大優先級的聲明將會被采用。

擴展閱讀前端面試題-CSS選擇器

GPU云服務器云服務器面試題棧面試題筆試面試題面試題內容

文章版權歸作者所有，未經允許請勿轉載,若此文章存在違規行為，您可以聯系管理員刪除。

轉載請注明本文地址：http://specialneedsforspecialkids.com/yun/115809.html

前端面試題-CSS優先級

摘要：優先級是基于不同種類選擇器組成的匹配規則。但是，在內部聲明的選擇器是會影響優先級。當兩條相互沖突的帶有規則的聲明被應用到相同的元素上時，擁有更大優先級的聲明將會被采用。擴展閱讀前端面試題選擇器一、選擇器優先級瀏覽器通過優先級來判斷哪一些屬性值與一個元素最為相關，從而在該元素上應用這些屬性值。優先級是基于不同種類選擇器組成的匹配規則。二、優先級計算優先級就是分配給指定的CSS聲明...

zorro 2019-08-01 18:41 評論0 收藏0
前端面試題：CSS中的選擇器權重

摘要：第二等代表選擇器，如，權值為。第三等代表類，偽類和屬性選擇器，如，權值為。第五等通配符子選擇器相鄰選擇器等的。第六等繼承的樣式沒有權值。 CSS中選擇器優先級的權重計算先看一段代碼，如下： a{ color: red; } #box a{ color: green; } [class=box] a{ c...

cppprimer 2019-08-29 17:10 評論0 收藏0
前端 CSS 面試大綱

摘要：比如說預處理器，組件化，工程化，兼容性處理等方面，這些主要是基于自己的開發經驗業界流行技術方案進行準備。但是在開始談面試前我想先提出一個概念學霸面試模型學校的學習和公司的工作有很多相似的地方。所以對于面試，請參考上學那會兒你們班學霸的姿勢。背景參加完廈門第四屆CSS Conf 后，讓我對 CSS 產生了新的思考。CSS 是前端必須熟練掌握并保持持續關注的技術，但是我又不想在 CS...

mating 2019-08-30 14:19 評論0 收藏0
前端面試題-CSS選擇器性能優化

摘要：不要在編寫規則時用標簽名或類名不要在編寫規則時用標簽名把多層標簽選擇規則用規則替換，減少查找避免使用子選擇器后代選擇器在中是最昂貴的選擇器。如果你關心頁面性能的話，他們真不該被使用擴展閱讀前端面試題選擇器前端面試題優先級一、CSS選擇符 CSS選擇符由一些初始化參數組成，這些參數指明了要應用這個CSS規則的頁面元素。作為一個網站的前端開發工程師，應該避免編寫一些常見的開銷很大的CS...

Scott 2019-08-30 14:08 評論0 收藏0
前端面試題-CSS選擇器性能優化

摘要：不要在編寫規則時用標簽名或類名不要在編寫規則時用標簽名把多層標簽選擇規則用規則替換，減少查找避免使用子選擇器后代選擇器在中是最昂貴的選擇器。如果你關心頁面性能的話，他們真不該被使用擴展閱讀前端面試題選擇器前端面試題優先級一、CSS選擇符 CSS選擇符由一些初始化參數組成，這些參數指明了要應用這個CSS規則的頁面元素。作為一個網站的前端開發工程師，應該避免編寫一些常見的開銷很大的CS...

XGBCCC 2019-08-01 18:42 評論0 收藏0