在分層選單中，從父元素繼承的樣式有時會出現問題。本文解決了在嵌套導航選單中防止 CSS 繼承的問題，確保只有頂級項目具有特定樣式。
提供的 HTML 結構利用具有分層結構的巢狀清單。問題在於如何將樣式套用於頂層清單項目（具有“top-level-nav”類別的“li”）而不影響巢狀子項。
使用子選擇器
一種方法是使用子選擇器(">"):
#parent > child
在這種情況下，它將是：
#sidebar > .top-level-nav
這可確保樣式僅套用於「#sidebar」元素的直接後代，有效地僅針對頂級導航項目。值得注意的是，Internet Explorer 6 不支援子選擇器。
利用多個子選擇器
或者，您可以使用多個子選擇器為特定深度的元素指定樣式:
#parent child child
對於實例：
#sidebar child child
此目標是「#sidebar」內兩層深處的元素。
避免程式碼重複
避免重複子項的樣式，可以修改現有的「#sidebar ul li」規則以應用於所有嵌套列表項，而具體樣式對於頂級項目，可以使用上面提到的子選擇器來定位。
以上是如何在設定頂級項目樣式時防止嵌套選單中的 CSS 繼承？的詳細內容。更多資訊請關注PHP中文網其他相關文章！
