CSS的三大特性

首發日期：2018-05-01

層疊性主要遵循的原則是就近原則，在不考慮優先順序的情況下，在多個樣式中最終生效的樣式是離標籤最近的樣式。【這裡要注意只覆蓋同樣的不可重複的樣式屬性，不會覆蓋不重複的屬性，不重複的屬性會合併下來（包括那些允許設定多個值的屬性也會合併，比如text-shadow）。】

依據層疊性的就近原則，第乙個div的背景色為藍色，第二個div的背景色為綠色。

可繼承的屬性比如有字型類屬性（字型顏色、字型大小之類的）、文字類屬性（行高之類的）、背景類屬性（背景顏色之類的）（要注意子標籤不會繼承父標籤的寬度、高度、邊距屬性。）

doctype html

>
<
html
>
<
head
>
<
meta 
charset
="utf-8"
/>
<
title
>document
title
>
<
style
>
divstyle
>
head
>
<
body
>
<
div>
<
p>p繼承div的樣式
下面的**可以從上到下，依次注釋選擇器來測試優先順序。
doctype html

>
<
html
>
<
head
>
<
meta 
charset
="utf-8"
/>
<
title
>document
title
>
<
style
>
/*從上到下，依次注釋選擇器來測試優先順序 
*/div
#id1
.class
divstyle
>
head
>
<
body
>
<
div>!import優先順序
div>
<
div 
style
="color:red"
>行內樣式優先順序
div>
<
div 
id="id1"
>id選擇器優先順序
div>
<
div 
class
="c1"
>類選擇器優先順序
div>
<
div>標籤選擇器優先順序
div>
body
>
html
>
上面的規則!important和行內樣式毫無疑問，但如果多個選擇器混雜來定義樣式的時候如何判斷他們的優先順序？答案是依據權重來判斷。

計算方法：
權重相同時，考慮就近原則：
doctype html

>
<
html
>
<
head
>
<
meta 
charset
="utf-8"
/>
<
title
>document
title
>
<
style
>
div .p1
p.p1
style
>
head
>
<
body
>
<
div>
<
p class
="p1"
>123
p>
div>
body
>
html
>
權重不同時，權重大的生效：

doctype html

>
<
html
>
<
head
>
<
meta 
charset
="utf-8"
/>
<
title
>document
title
>
<
style
>
p.p1:first-child
div .p1
style
>
head
>
<
body
>
<
div>
<
p class
="p1"
>123
p>
div>
body
>
html
>
 
CSS三大特性
css三大特性 1.繼承性 作用 子元素可以繼承父元素的樣式 text font line 這些元素開頭的都可以繼承，以及color屬性 特殊性 1 a標籤的字型顏色不能繼承，必須對a標籤自定義字型顏色才能修改 2 h1 h6標籤的字型大小不能繼承，必須對標籤自身修改字型大小才有效。我是div1中的...
CSS三大特性
樣式具有繼承性，一般有關text line font 都能夠繼承。a標籤的顏色不能繼承 繼承title type text css div1 字型和顏色被繼承偽類但是邊框沒有 style head id div1 這是div1中的內容 id div22 這是div2中的內容 div div body...
CSS三大特性
1.繼承 子代可以直接使用父代的某些樣式 特徵 當然有些可以繼承，有些不能繼承。例 介是div1的內容 介是div1的後代div2中的內容 結果為 div2同樣繼承了div1的樣式。div2雖然沒有設定這樣的樣式，但是實際上卻使用了該樣式。說明它的樣式從它的父代div1那裡繼承而來。但是並不是所有的...