Question

为什么这不起作用？我是CSS的新手，我不知道为什么以下内容不起作用。

<div id="nav">
    <ul id="tabnav">
        <li class="selected"><a href="index.php">Tab One</a></li>
        <li><a href="index2.html">Tab Two</a></li>
        <li><a href="index3.html">Tab Three</a></li>
        <li><a href="index4.html">Tab Four</a></li>
    </ul>
</div>

CSS：

ul #tabnav li.selected { 
    background-color: #f00;
}

Answer 1

因为tabnav元素的 child 没有标识为ul的元素。

删除ul

#tabnav li.selected { 
    background-color: #f00;
}

或将其附加到ul

ul#tabnav li.selected { 
    background-color: #f00;
}

Answer 2

除上述答案外：
我不知道css如何处理背景颜色：＃f00;十六进制值应为六位小数。（两个首先代表红色，下一个蓝色和最后一个绿色）

background-color:#FF0000;

Answer 3

尝试：

<style type="text/css">
#nav #tabnav li.selected {
    background-color: #f00;
}
</style>

CSS类选择器问题

3 个答案: