CSS控制繼承

CSS 提供了五個特殊的通用屬性值來控制繼承。每個 CSS 屬性都會接受這些值。

inherit : 將套用於所選元素的屬性值設定為與其父元素的屬性值相同。實際上，這「開啟了繼承」。

.parent {
  font-size: 16px;
}

.child {
  font-size: inherit; /* 子元素繼承父元素的字體大小 */
}

initial : 將套用於選定元素的屬性值設定為該屬性的初始值。

.element {
  font-size: initial; /* 字體大小被重置為預設值 */
}

revert : 將套用於選取元素的屬性值重設為瀏覽器的預設樣式，而不是套用於該屬性的預設樣式。這個值unset在很多情況下都是一樣的。

.element {
  font-size: revert; /* 恢復字體大小為預設值，並應用樣式表中的其他樣式 */
}

revert-layer : 將套用於選取元素的屬性值重設為在前一個級聯層中建立的值。

.parent {
  font-size: 18px;
}

.child {
  font-size: revert-layer; /* 子元素恢復為父元素的字體大小，並在樣式表中覆蓋其他樣式 */
}

unset : 將屬性重設為其自然值，這意味著如果該屬性是自然繼承的inherit，則其行為類似於 ，否則行為類似於initial。

.element {
  font-size: unset; /* 重置字體大小為其初始值或 initial（視屬性而定） */
}