色婷婷狠狠18禁久久YY,CHINESE性内射高清国产,国产女人18毛片水真多1,国产AV在线观看

css 同名樣式

林子帆2年前12瀏覽0評論

在CSS編碼過程中,有時會出現多個同名樣式,這時候CSS會按照一定的規則來選擇應用哪一個樣式。

首先,CSS會根據優先級(specificity)來判斷哪一個樣式更具體,從而選擇使用。優先級的計算方式是:每出現一次class或ID,就會給樣式加上一個權重,ID的權重是100,class的權重是10,標簽選擇器的權重是1。如果一個樣式里有多個選擇器,那么權重會相加,最終權重高的樣式會被應用。

/* 兩個同名樣式 */
.my-box {
width: 200px;
height: 200px;
}
.my-box {
background-color: red;
}
/* 另一個同名樣式 */
.button {
font-size: 16px;
color: #fff;
}
#submit {
background-color: blue;
}
.button {
padding: 10px;
}

在上面的示例中,如果my-box和button都是class,則按照CSS的規則,樣式表后者會覆蓋前者,所以最終.my-box元素的背景顏色是紅色,而不是默認的透明色。

在另一個同名樣式中,#submit是ID選擇器,所以它的權重最高,會覆蓋前面兩個class的樣式,所以最終的.button元素會有藍色背景色和10px的內邊距。

當同名樣式的權重相等時,CSS會根據源代碼中的順序來判斷哪一個樣式最后被定義,從而選擇使用。

為了避免同名樣式導致的問題,我們可以將CSS樣式進行合并,盡量避免出現多個同名樣式。

/* 合并同名樣式 */
.my-box {
width: 200px;
height: 200px;
background-color: red;
}
.button {
font-size: 16px;
color: #fff;
background-color: blue;
padding: 10px;
}

以上是同名樣式的一些基本知識和注意事項,希望能對有需要的朋友有所幫助。