CSS的樣式表繼承指的是,特定的CSS屬性向下傳遞到子孫元素。總的來說,一個HTML文檔就是一個家族,然后html元素有兩個子元素,相當於它的兒子,分別是head和body,然后body和head各自還會有自己的兒子,最終形成了一張家族譜。
有時可能我們在body里面設置了一些屬性,結果,body下面所有的后代元素都可能享受到,這就是樣式繼承。就像一句俗語一樣,“龍生龍,鳳生鳳,老鼠的兒子會打洞”。樣式繼承,可以給我們的網頁布局帶來很多的便利,讓我們的代碼變得更加簡潔,但是,如果不了解,或者使用不當,也有可能會給我們帶來很多不必要的麻煩。
因此,如果了解了哪些樣式是會繼承到后代元素的,那么就可以避免這些問題的發生了。
以下樣式都會繼承到后代元素:
文本相關屬性 | |||
---|---|---|---|
font-family | font-size | letter-spacing | line-height |
font-style | font-variant | text-align | text-indent |
font-weight | font | text-transform | word-spacing |
color | direction | ||
列表相關屬性 | |||
list-style-image | list-style-position | list-style-type | list-style |
表格和其他相關屬性 | |||
border-collapse | border-spacing | caption-side | empty-cells |
cursor |