css - 更改所有 `li` 的背景（悬停）

Question

我想改变所有li拥有div的背景<a class="wasAdRead"。

<li>
    <div class="notification_div" style="padding-top: 6px;">
         <a class="wasAdRead" style="cursor:pointer;">Remind me later</a>
    </div>
</li>

我试过了：

#notification-list li[div[.wasAdRead]]:hover
{
    background: white;
}

任何帮助表示赞赏！

Answer 1

你不能只用 CSS 来做到这一点（无论如何在 2013 年）。您需要使用 javascript 执行此操作（通过选择每个<li>并检查其内容）。在 jQuery 中，它给出了类似的内容：

$("a.wasAdRead").parents('li').css("background-color", "white");

...或者您可以等待 CSS4（祝您好运，您可以等待多年的浏览器支持...）

您可以查看这篇关于您的问题的帖子：Is there a CSS parent selector?

Answer 2

在 CSS 中是不可能的，你只能用 JS 来做到这一点。您也可以尝试这种替代解决方案。

.notification_div a.wasAdRead{
   display:block;
   padding-top:6px;
   cursor: pointer;
   background-color:white;
}

Answer 3

这是你要找的吗

li > .notification_div > .wasAdRead:hover{
   display:block;
   padding-top:6px;
   cursor: pointer;
   background-color:red;
}

小提琴