防止元素繼承 CSS

Question

我想知道是否有辦法防止子元素繼承它的父 css，例如我有類似的東西：

<div class="MenuSections>
<figure class="MenuIcon">
<img.../>
<figcaption class="MenuCaption">
</figure>
</div>

然后我使用 JQuery 在點擊部分時更改部分和標題顏色：

$(this).find("div").css("background-color", "white");
$(this).find(".MenuCaption").css("color", "Darkgreen");

但由於我的 img 是透明的，因此在白色背景上看不到。

我知道您可以覆蓋子元素上的 css 屬性，但顯然這不適用於 img 元素，那我該怎么辦？

筆記：

• BG 顏色不可協商
• 位置：絕對不能使用
• img 必須是透明的，所以我不能在 JQuery 上的 imgs 之間切換

Answer 1

您可以在 Jquery 中使用 CSS 選擇器。

因此，在您的 Jquery 代碼中，您可以執行類似 ..

$(this).find("div *:not(<input element not to be selected>)).css("background-color", "white");

* 聲明所有元素...因此所有不是您選擇的元素。

您可以在此處找到有關選擇器的更多信息： https ://api.jquery.com/category/selectors/