css的繼承和層疊

2021-10-16 12:21:35 字數 520 閱讀 4781

!important > 行內式 > id選擇器 > 類選擇器 > 標籤選擇器

權重值:  無窮大        1000         100             10                1

同一選擇器,靠後者生效

繼承的權重值為零,所以繼承的樣式可以被任何選擇器修改的屬性對應的屬性值所覆蓋。

例:

如上所示,案例一和案例二兩個h1標籤繼承了來自父元素的id選擇器所賦予的color屬性值為blue,而我們單獨用類選擇器對案例二賦予其color屬性值為red。

我們知道id選擇器的權重大於類選擇器,但是由圖可知,我們用chrom自帶的偵錯程式進行除錯,右下角畫圈部分表示繼承自父元素div的屬性,但是畫了刪除線,表示沒有生效,因為被類選擇器設定的屬性值所覆蓋。由此可見繼承的權重值比類選擇器的1還要低,我們可以認為其權重值為0。

CSS 層疊和繼承

我們知道文件中的乙個元素可能同時被多個css選擇器選中,每個選擇器都有一些css規則,這就是層疊。這些規則有可能不矛盾的,自然這些規則將會同時起效,然而有些規則是相互衝突的,例如 html xmlns head title css cascade title style type text css ...

css特性 繼承和層疊

1.乙個元素如果沒有設定某屬性的值,就會跟隨父元素的值 2.當然,乙個元素如果有設定某屬性的值,就會使用自己設定的值 3.比如color font size等屬性是可以繼承的 4.可以用inherit強制繼承 5.css繼承的是計算值 css允許多個css屬性層疊 1.使用相同的選擇器,後面的會把前...

CSS 繼承與層疊

css 繼承 即,從父元素那繼承部分css屬性 好處 1.父元素設定樣式,子元素可以繼承部分屬性 2.減少css 注意 當元素本身的樣式與繼承而來的樣式有衝突時,將忽略繼承來的樣式,如下 chrom瀏覽器預設字型大小是16px h1 預設字型大小font size 是2em 正常字型的兩倍 因此,在...