无需递归访问列表中的第一个 li

Question

我有这样的结构：

<div id="sidebar">
<ul>
<li>
    <a href="a.link/">"Main item"</a>
    <ul>
        <li class="cat-item cat-item-21">
            <a href="a.link/">"Child item"</a>
        </li>
    </ul>
</li>

已生成，无法修改。但是，使用 CSS，我想让 "Main Item" 不可点击，使用：

pointer-events:none

如何访问 "ul" 中的第一个 "li" 并修改他的 CSS 而不触及其余部分？

Answer 1

您需要使用 > 标识符来仅指定您正在查看的每个元素深入一层，例如...

#sidebar > ul > li > a{ pointer-events:none }

这将select只有第一个 ul 的第一个 li 的第一个 a #sidebar

无需递归访问列表中的第一个 li

Access first li in list without recursivity

html

css

html-lists