的優先順序大小 6 樣式表層疊性和繼承性以及優先順序

2021-10-12 21:50:55 字數 1072 閱讀 7776

層疊性

當多個樣式作用到同乙個(同類)標籤上,樣式發生了衝突,那麼此時,瀏覽器解析的**的順序就是從上往下,那麼就使用了最後乙個樣式,如下示例就是使用了下面的.div1的樣式;

.box {

font-size: 60px;

color: red;

.div1 {

font-size: 60px;

color: blue;

北京馬哥教育

繼承性繼承性發生的前提就是巢狀(包含)關係;

可以繼承的樣式:

文字顏色

文字大小

字型字型粗細

文字的風格都可以繼承

行高可以繼承

文字的所有屬性都可以繼承

特殊情況:

h1-h6是繼承了,但是顯示的不是繼承後的大小,h1的公式為2em*font-size;

.father {

width: 600px;

height: 100px;

color: red;

font-size: 40px;

font-family: 宋體;

text-align: center;

border: 1px solid;

北京馬哥教育

優先順序預設樣式

0 1 10 100 1000 1000以上

繼承優先順序特點

繼承的權重為0,當自己沒有定義樣式的時候,那麼就使用繼承來的樣式,如果有自定義樣式的時候,繼承權重為0;

.father {

color: red;

font-size: 40px;

p {font-size: 10px;

color: blue;

.box {

color: yellow;

font-size: 40px;

北京馬哥教育

css特性 層疊性,繼承性,優先順序

1.層疊性 多種css樣式的疊加 原則 1.樣式衝突時遵循 就近原則,哪個樣式離結構近,折行哪個 2.樣式不衝突時,不會層疊 口訣 長江後浪推前浪,前浪死在沙灘上 2.繼承性 子標籤會繼承父類的某些標籤,如文字顏色和字型大小 注意 1.前檔的使用繼承可以簡化 建簡化css樣式的複雜度 2.子元素可以...

CSS樣式的繼承性和優先順序

本文主要內容 1.css繼承性 我是段落1 我是段落2 我是段落3 效果圖如下 上方 中,我們給div標籤增加字型紅色屬性,卻發現,div裡的每乙個子標籤 也增加了紅色屬性。於是我們得到這樣的結論 有一些屬性,當給自己設定的時候,自己的後代都繼承上了,這個就是繼承性。繼承性是從自己開始,直到最小的元...

CSS 三大特性(層疊性 繼承性 優先順序)

層疊 繼承 優先順序 是我們學習css 必須掌握的三個特性。所謂層疊性是指多種css樣式的疊加。是瀏覽器處理衝突的乙個能力,如果乙個屬性通過兩個相同選擇器設定到同乙個元素上,那麼這個時候乙個屬性就會將另乙個屬性層疊掉 比如先給某個標籤指定了內部文字顏色為紅色,接著又指定了顏色為藍色,此時出現乙個標籤...