首頁 >web前端 >前端問答 >css 層疊是什麼

css 層疊是什麼

藏色散人
藏色散人原創
2021-04-13 10:02:583650瀏覽

css層疊是CSS的一個基本特徵,它是一個定義瞭如何合併來自多個來源的屬性值的演算法;CSS層疊性是指CSS樣式在針對同一元素配置相同屬性時,依據層疊規則來處理衝突,選擇應用權重高的CSS選擇器所指定的屬性。

css 層疊是什麼

本文操作環境:windows7系統、HTML5&&CSS3版、Dell G3電腦。

什麼是css層疊?

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

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

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

層疊性指的是上級標籤的樣式會自動繼承到其所有下級標籤,如針對設定的標籤選擇器所設的字體樣式會自動套用到下的

中,除非

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

層疊性指的是樣式的優先級,當產生衝突時以優先級高的為準:

  • 開發者樣式>讀者樣式>瀏覽器樣式(除非使用!important標記)

  • id選擇符>(偽)類別選擇符>元素選擇符號

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

CSS層疊演算法期望透過挑選CSS宣告來為CSS屬性設定正確的值。 CSS宣告可以有不同的來源:

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

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

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

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

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

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

【推薦學習:css影片教學

以上是css 層疊是什麼的詳細內容。更多資訊請關注PHP中文網其他相關文章!

陳述:
本文內容由網友自願投稿,版權歸原作者所有。本站不承擔相應的法律責任。如發現涉嫌抄襲或侵權的內容,請聯絡admin@php.cn