Question

我有水平导航。一些具有下拉导航的链接。像这样：

<ul>
    <li>
        <a>Title 1</a>
    </li>

    <li>
        <a>Title 2</a>
        <ul>
            <li><a>Link</a></li>
            <li><a>Link</a></li>
            <li><a>Link</a></li>
        </ul>
    </li>

    <li>
        <a>Title 3</a>
        <ul>
            <li><a>Link</a></li>
            <li><a>Link</a></li>
            <li><a>Link</a></li>
        </ul>
    </li>
</ul>

正如您所看到的，“标题1”没有下拉菜单，但其他人都会。是否可以仅将图标应用于具有下拉菜单的链接？

Answer 1

如果您为主ul提供了ID，则可以通过以下代码实现：

ul#nav > li > a:only-child  {
    // Do something with link without dropdown  
}

ul#nav > li > a {
    // Do something with link with dropdown    
}

以下是我为链接指定了特定颜色的示例：http://jsfiddle.net/y2XtA/

将图标设置为具有下拉菜单的导航（仅限CSS）

1 个答案: