Question

我有这个标记：

<div>
    <ul>
        <li>
            <a>Target Me!</a>
            <ul>
                <li>
                    <a>And Not me.</a>
                </li>
            </ul>
         </li>
         <li>
            <a>Target Me!</a>
         </li>

    </ul>
</div>

现在，我想知道我是如何定位作为外部<ul>的直接子项的标记，它不包含{{1}内的<a>标记在<ul>里面（我希望它听起来不会令人困惑）

我试过了：

<li>

但它仍定位所有div ul li > a { border: 1px solid #000; } s。

有人可以帮帮我吗？

Answer 1

div > ul > li > a { border: 1px solid #000; }

适用于您的情况。

但是，我宁愿利用一个类来实现这一目标。

Answer 2

替代地

div ul li:first-child { border: 1px solid #000; }

但只有当你想要的<a>确实是<li>的第一个孩子时，这才有效。

Answer 3

我相信这会奏效：

div ul li > a:first-child { border: 1px solid #000; }

Answer 4

使用像这样的第一个子伪类

div ul > li:first-child > a:first-child

这只会将第一个li定位到ul的子目录，然后只定位第一个子锚元素。对你来说这很复杂，你最好在这里上课。

Answer 5

试试这个http://jsbin.com/ecenan

基本上CSS应该是

div > ul > li > a { border: 1px solid #000; }

如何定位第一个<a> tags in a <ul></ul></a>

5 个答案: