后代选择器 Descendant combinator

Docs

后代组合器 Descendant combinator：（空格）组合器选择前一个元素的后代节点。

语法：A B
例子：div span 匹配所有位于任意 <div> 元素之内的 <span> 元素。

后代组合器 Descendant combinator
/* List items that are descendants of the "my-things" list */
ul.my-things li {
  margin: 2em;
}

后代组合器（通常用单个空格（" "）字符表示）组合了两个选择器，如果第二个选择器匹配的元素具有与第一个选择器匹配的祖先（父母，父母的父母，父母的父母的父母等）元素，则它们将被选择。利用后代组合器的选择器称为后代选择器。

从技术上讲，后代组合器是两个选择器之间的一个或多个 CSS 空格字符-空格字符和/或四个控制字符之一：回车，换页，换行和制表符在没有其他组合器的情况下。此外，组成组合器的空白字符可以包含任意数量的 CSS 注释。

HTML
CSS

<div class="translate-collect">
  <p class="wrong">through the roof 这个短语的含义不是指"从房顶上经过"。</p>
  <p class="right">其正确的含义是：go through the roof 飞涨；激增</p>
</div>

div.translate-collect {
  width: 88%;
  background-color: green;
  font-weight: bold;
}

div.translate-collect p.wrong {
  background-color: red;
  font-size: small;
  font-weight: 400;
}

http://localhost:3000/css-descendant-combinator.html

through the roof 这个短语的含义不是指"从房顶上经过"。

其正确的含义是：go through the roof 飞涨；激增。