css - 像 ul.lsidebar a{} 这样的 CSS 类是什么意思？

Question

这个叫什么？我从未体验过CSS。

我猜那个类只会影响那个标签。如果你知道，请给我一些如何使用它的例子。我说的是 ( ul) 部分。

代码如下：

ul.lsidebar a{}

Answer 1

它lsidebar专门针对 DOM 节点的类名ul

例子：

<div class="lsidebar">
    <a href="#">ab</a>
</div>
<ul class="lsidebar">
  <li><a href="#">a</a></li>
  <li><a href="#">b</a></li>
</ul>

如果你这样做.lsidebar a{}，它将定位a在和的后代节点div中ul

但在这种情况下，ul.lsidebar a{}专门针对（带有文本和在这种情况下）a的后代节点。ulaab

此链接可能会帮助您了解 CSS 在 DOM 中的定位方式

Answer 2

ul.lsidebar在 HTML 中表示以下内容：

 <ul class="lsidebar"></ul>

这通常称为类选择器

看到最后那一点a了吗？这称为后代选择器，这意味着它将设置以下 HTML 元素的样式：

 <ul class="lsidebar">
      <a href="#">I'll be styled!</a>
 </ul>

希望这可以帮助！

Answer 3

可能有几个元素属于“lsidebar”类。ul.lsidebar代码仅引用作为无序列表 (ul) 的元素“lsidebar” 。

“a”引用无序列表（链接）内的锚元素。

karthikr 的例子是相关的。在他的示例中，代码将为 a 和 b 链接设置样式。