如何防止繼承特定 Div 內的 CSS 樣式？

將div 與公共CSS 樣式隔離

問題：

在提供的HTML 程式碼中，CSS 樣式應用於img 和h1 元素也會影響#mydiv div 中的元素。如何防止這種繼承？

解決方案：

使用all 速記屬性：

CSS Level 3 引入了all 簡寫屬性，允許您重寫屬性，允許您重寫屬性，允許您重寫屬性，允許您重寫屬性置元素的所有屬性。透過在 #mydiv div 上設定 all: 初始值，從其祖先繼承的所有樣式都將被封鎖。

要允許在 #mydiv div 中設定樣式，請將 all: unset 套用至其後代。這將啟用 div 內的繼承，同時防止外部 CSS 影響它。

<code class="css">#mydiv {
  all: initial;
}
#mydiv * {
  all: unset;
}</code>

手動設定各個屬性：

為了更廣泛的瀏覽器支持，請手動設定所有已知的屬性#mydiv div 的CSS 屬性為初始值，並為其後代繼承或初始值（如果適用）。這會模擬 all 屬性的行為。

其他注意事項：

• 考慮在 div 上使用類別而不是 ID，以實現更好的特異性控制。
• 阻止潛在偽元素後代的樣式，以確保完全隔離。
• 監視瀏覽器對 all 速記屬性的支持，因為它尚未得到普遍支援。

以上是如何防止繼承特定 Div 內的 CSS 樣式？的詳細內容。更多資訊請關注PHP中文網其他相關文章！