1. 首頁 > 生活百科 > >

一文了解CSS3中的新特性@layer( 四 )

小知識it知識


    !important 樣式高于非 !important 樣式
    在比較 !important 規則時 ， 優先級順序與正常規則相反 ， 在正常狀態下優先級越低的 ， 在 !important 下優先級越高
總結一下綜上 ， 便是關于 CSS @layer 的基礎相關知識 。
CSS @layer 的誕生 ， 讓我們有能力更好的劃分頁面的樣式層級 ， 更好的處理內部樣式與外部引用樣式的優先級順序 ， 屬于比較重大的一次革新 。
同時 ， 它也讓我們意識到要逐漸摒棄大規模使用 !important 去覆蓋樣式優先級的錯誤做法 ， 避免許多因為優先級問題帶來的不必要的副作用 。
當然 ， 時至今天（2022-03-14） ， 我們來看一眼兼容性：
一文了解CSS3中的新特性@layer

文章插圖

雖然紅了一大片 ， 但是 ， 在最新版的 Chrome、Safari、Firefox、Edge 都已經開始支持 CSS @layer ， 并且 ， 目前已經可以通過一些 polyfill 初步使用它 ， 相信在不久的將來 ， 它將會成為業務 CSS 代碼中必不可少的一部分 。
延伸閱讀外網對 CSS @layer 已經有非常多的討論 ， 這里羅列一些優質文章 ， 感興趣的可以繼續閱讀：
    Cascade Layers ExplainerGetting Started With CSS Cascade Layers文章內部分截圖引用于 How does !important actually work? (It's not what you think!)
最后好了 ， 本文到此結束 ， 希望對你有幫助 ??
（學習視頻分享：web前端）
以上就是一文了解CSS3中的新特性@layer的詳細內容 ， 更多請關注電腦自學網其它相關文章！
【一文了解CSS3中的新特性@layer】

推薦閱讀