Question

我有一些HTML如下所示：

<div id="myDiv">
  <div class="some-group open">
    <ul class="multi-item-container some-list">
      <li class="multi-item multi-group multi-group-button">
        <label>Header text</label>
      </li>
      <li><a ...>...</a></li>
      <li><a ...>...</a></li>
      <li><a ...>...</a></li>
      <li class="multi-item multi-group multi-group-button">
        <label>Another header</label>
      </li>
      <li><a ...>...</a></li>
      <li><a ...>...</a></li>
      <li><a ...>...</a></li>
    </ul>
  </div>
</div>

我知道我希望代表标题的label元素使用以下CSS：

... {
  padding-left:0px;
  margin-left:-24px;
}

但是，我不知道如何使用从myDiv开始的嵌套CSS选择器。如何使用CSS选择器以此样式更新标题？

谢谢！

Answer 1

有很多方法，它可以取决于各种因素，但这些方法可行：

不太具体：

#myDiv label {...}

更具体：

#myDiv div.some-group.open ul.multi-item-container.some-list li.multi-item.multi-group.multi-group-button label {...}

Answer 2

从“#myDiv到label

简单地”走“DOM

#myDiv ul li label

使用CSS选择器设置样式

2 个答案: