css疊層 什麼是css層疊?

2021-10-13 06:19:30 字數 928 閱讀 1274

層疊是css的乙個基本特徵,它是乙個定義了如何合併來自多個源的屬性值的演算法。它在css處於核心地位,css的全稱層疊樣式表正是強調了這一點。

css層疊性是指css樣式在針對同一元素配置同一屬性時,依據層疊規則(權重)來處理衝突,選擇應用權重高的css選擇器所指定的屬性,一般也被描述為權重高的覆蓋權重低的,因此也稱作層疊。

每個css選擇器都會有乙個權重,當兩個選擇器同時配置同一元素的同一屬性時(比如乙個設定color:red,另乙個color:black),就會產生衝突,而解決衝突的方案就是css選擇器的權重,權重高的來覆蓋權重低的。

層疊性指的是上級標籤的樣式會自動繼承到其所有下級標籤,如針對

設定的標籤選擇器所設的字型樣式會自動應用到下的

中,除非

重寫了相關樣式將其覆蓋。

層疊性指的是樣式的優先順序,當產生衝突時以優先順序高的為準:開發者樣式》讀者樣式》瀏覽器樣式(除非使用!important標記 )

id選擇符》(偽)類選擇符》元素選擇符

權重相同時取後面定義的樣式

1、瀏覽器會有乙個基本的樣式表來給任何網頁設定預設樣式。這些樣式統稱**使用者**樣式**。一些瀏覽器通過使用真正的樣式表,而其他則通過**模擬,但無論是哪種情形都應是不可被檢測的。

而且部分瀏覽器允許使用者修改使用者**樣式。儘管html標準對使用者**樣式做了諸多限制,瀏覽器仍大有可為,具體表現在不同瀏覽器間會存在重大的差異。

為了減輕開發成本以及降低樣式表執行所需的基本環境,網頁開發者通常會使用乙個css reset樣式表,強制將常見的屬性值轉為確定狀態。

2、網頁的作者可以定義文件的樣式,這是最常見的樣式表。大多數情況下此型別樣式表會定義多個,它們構成**的視覺和體驗,即主題。

3、讀者,作為瀏覽器的使用者,可以使用自定義樣式表定製使用體驗。

儘管css樣式會來自這些不同的源,但它們的作用範圍是重疊的,而層疊演算法則定義了它們如何相互作用。

css疊層 關於css層疊

確定應當向乙個元素應用哪些值時,使用者 不僅要考慮繼承,還要考慮宣告的特殊性,另外需要考慮宣告本身的 這個過程就稱為層疊。css權威指南 特殊性內聯樣式 1,0,0,0 id0,1,0,0 類 屬性選擇 偽類 0,0,1,0 標籤 偽元素 0,0,0,1 結合符 萬用字元 0,0,0,0 1 htm...

CSS學習(2)層疊cascade

使用了 important的使用者樣式表 使用了 important的設計者樣式表 設計者樣式表 使用者樣式表 瀏覽器 使用者預設的樣式表 樣式表中樣式規則的次序由選擇符selector的特殊性specificity確定。選擇符selector的特殊性定義如下。一般情況下,規則的特殊性遵照如下規律 ...

CSS中層疊和CSS的7階層疊水平

今天搜尋資料時,忽然發現了以前沒注意的乙個知識點,所以拖過來搞一搞,這個知識點叫做css的7階層疊水平 在說這個知識之前,我們必須要先了解乙個東西以便於我們更好的理解css的7階層疊水平 這個東西就是z index屬性 此篇為上篇,僅僅講z index 基本含義 z index通俗來說就是在z軸上的...