0

以下样式在规格方面有什么区别?

  ul .active { background: #E7F3EF;}
  ul li.active { background: #E7F3EF;}


<ul>
  <li class="active">Item 1</li>
  <li>Item 2</li>
  <li>Item 3</li>
</ul>

最后一个我错误地用 sass 编码,ul li .active花了我一些时间才弄清楚。

4

1 回答 1

3
ul .active { background: #E7F3EF;}

这将匹配任何具有类名“活动”的元素,该元素是ul元素的后代。

ul li.active { background: #E7F3EF;}

这将匹配任何li具有类名“活动”的元素,该元素是元素的后代ul

ul li .active { background: #E7F3EF;}

这将匹配任何具有类名“活动”的li元素,该元素是元素的后代,即元素的后代ul

正如您所注意到的,空格是相关的。选择器中的空格通常表示后代组合子。

有关规范的相关部分,请参阅“后代组合器”。

于 2012-06-08T11:24:32.687 回答