CSS繼承、層疊和特殊性
阿新 • • 發佈:2017-09-26
important alt images png import 根據 gre 原來 border
1.繼承
(1)樣式應用於某個特定的HTML標簽元素,而且應用於其後代。
(2)但某些標簽不適用,如border;
(3)例子:p{color:red;}設置了顏色
<p class="first">
<p id="second">
效果一樣。
2.特殊性
(1)當標簽匹配多個樣式,瀏覽器根據權值來判斷適用哪種CSS樣式,權值高就使用哪種。
(2)例子:
p{color:red;} .first{color:green;} <p class="first">三年級時,我還是一個<span>膽小如鼠</span>的小女孩。</p>
“膽小如鼠”顯示的是綠色的字體。
(3)規則:
3.層疊
(1)層疊就是在html文件中對於同一個元素可以有多個css樣式存在,當有相同權重的樣式存在時,會根據這些css樣式的前後順序來決定,處於最後面的css樣式會被應用。
(2)例子:
p{color:red;} p{color:green;} <p class="first">三年級時,我還是一個<span>膽小如鼠</span>的小女孩。</p>
(3)設置樣式層次一致,最後文本顯示綠色,後面覆蓋了前面的。
4.重要性
(1)為某些樣式設置最高權值,使用important解決。
(2)語法:p{color:red!important;}
(3)例子:
p{color:red!important;} p{color:green;} <p class="first">三年級時,我還是一個<span>膽小如鼠</span>的小女孩。</p>
(4)原來是綠色覆蓋了紅色,現在是紅色覆蓋了綠色,因為紅色設置了最高權值。
CSS繼承、層疊和特殊性