第15章 倒黴的克拉倫斯(2 / 2)

瀏覽器會有一個基本的樣式表來給任何網頁設置默認樣式,稱為用戶代理樣式。

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

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

注意的是,原本級聯水平高的聲明應用了 !important 後,其優先級反而低,而原本級聯水平低的聲明應用了 !important 後,優先級反而高。

繼承

每個CSS 屬性定義的概述都指出了這個屬性是默認繼承的 (\"Inherited: Yes\") 還是默認不繼承的 (\"Inherited: no\")。這決定了當你沒有為元素的屬性指定值時該如何計算值。

例如,你設置一個元素的 color 和 font-family,每個在裏麵的元素也都會有相同的屬性,除非你直接在元素上設置屬性。但是如果你在一個元素上設置 width 為 50% ,所有的後代元素則不會是父元素的寬度的 50% 。

盡管每個 CSS 屬性頁都列出了屬性是否被繼承,但我們通常可以通過常識來判斷哪些屬性屬於默認繼承。

inherit 關鍵字允許顯式的聲明繼承性,它對繼承和非繼承屬性都生效。

可以使用 all 簡寫屬性一次控製所有屬性的繼承,該屬性將其值應用於所有屬性。

常見可繼承屬性有:字體係列屬性、文本係列屬性(color、text-align、letter-spacing 等)。

常見不可繼承屬性有:背景係列屬性、盒子模型屬性(display、max-width、width、height、margin 、outline、border、padding 等)、定位屬性(float、clear、position、top、overflow、clip、z-index 等)。

總結

CSS 聲明的優先級取決於定義它的樣式表和級聯層。

可以設置自定義樣式表來覆蓋開發人員定義的樣式:例如用戶可能視力受損,並想在所有網頁上設置兩倍的正常字體大小,以便更容易進行閱讀。

可以使用新特性級聯層:你可以讓非分層樣式(在任何層之外聲明的 CSS 樣式會被按聲明的順序組合在一起,形成一個未命名的層,它會被當作最後聲明的層)覆蓋分層樣式,或者你可以讓後麵的層中聲明的樣式覆蓋先前的層中聲明的樣式。例如,作為開發人員,你可能無法編輯第三方的樣式表,但你可以將外部的樣式表導入級聯層中,以便你自己的樣式可以輕鬆地覆蓋導入的樣式,無需擔心第三方選擇器的優先級。