如何在另一个元素内部进行元素选择？

Question

我有一个关于CSS选择器的问题。当一个具有特定类名的

在一个具有类名为 saft 的

内部时，我该如何选择它？这个CSS类别在其他地方也被使用，我不想改变所有地方的样式。

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

Answer 1

只需执行：

ul.saft .textSlide {

这将实现您所需的功能

Answer 2

只需在父元素和子元素之间使用CSS后代选择器（一个空格）：

ul.saft div.textSlide {
    /* CSS规则 */
}

* {
  margin: 0;
  padding: 0
}

li {
  list-style-type: none;
}

ul.saft div.textSlide {
  background-color: #f90;
  font-weight: #000;
}

<ul class="saft">
  <li>
    <div class="textSlide">在textSlide类元素中的一些文本</div>
  </li>
</ul>
<div class="textSlide">更多文本，也在textSlide元素中</div>