CSS的三大特性（層疊性、繼承性、優先級）

@[TOC](CSS的三大特性)
           

CSS層疊性

CSS層疊性：當給相同的選擇器設定相同的樣式（比如都設定

color

），這時會引發樣式沖突，層疊性的出現解決了這一樣式沖突的問題，後面的樣式會重疊（覆寫）前面的樣式

CSS繼承性

CSS繼承性(inherited form)：子标簽會繼承父标簽的某些樣式,主要是跟文字相關的樣式(

text-

、

font-

、

line-

以及

color

)，簡單了解就是：子承父業

CSS優先級

CSS優先級：當同一個元素被多個選擇器選中，就需要考慮優先級的大小進行樣式設定，這裡可以用選擇器權重值總和來區分

• 當選擇器相同，按照層疊性設定樣式
• 當選擇器不同，按照選擇器權重值的大小總和設定樣式

各個選擇器的權重值

選擇器	權重值
繼承和*
元素選擇器	1
類選擇器(.)	10
ID選擇器(#)	100
行内樣式(style="")	1000
!important	無窮大

示例：

div div p {
	color: red;
}
/*權重值總和為1+1+1*/
#demo2 {
	color: green;
}
/*權重值總和為1000*/
div .demo1 {
	color: blue;
}
/*權重值總和為1+100*/
#box1 {
	color: yellow;
}
/*權重值總和為0，因為#box1是父元素，直接繼承*/
           

<div>
	<div id="box1">
		<p class="demo1" id="demo2">這是一個自然段</p>
	</div>
</div>
           

綜上

<p>

中文字的顔色是藍色（權重值最大）