css - 如何仅在另一个元素内选择一个元素？

Question

我有一个关于 CSS 选择器的问题。仅当它在具有类名的 a 中时，如何选择<div>具有特定类名的a ？这个 CSS 类在其他地方使用，我不想到处更改样式。<ul>saft

<div id="floater">
    <ul class="saft">
        <li><div class="textSlide"></li>
    </ul>
</div>

Answer 1

Simply use the CSS descendant selector (a space) between the parent element and the descendant element:

ul.saft div.textSlide {
    /* CSS rules */
}

JS Fiddle demo.

In this case the rules applied to the div of class textSlide will only apply if its ancestor is a ul of the class saft. You could, instead, use the immediate child combinator, the > but then you'd have to specify the div in relation to each parent/ancestor up to the one whose class is required, which gives potentially difficult to maintain CSS (not in this case, but it can, over time, become problematic).

Answer 2

做就是了：

ul.saft .textSlide {

这达到了你所需要的

Answer 3

只有当它在具有类名 saft 的 UL 中时，您才可以轻松地选择具有特定类名的 div，如下所述 css ：-

ul.saft .textSlide {
color:red;
}

或查看演示：- http://tinkerbin.com/mcrh7iMq