【问题标题】:Can't have selected tab font color to black不能将选项卡字体颜色选择为黑色
【发布时间】:2013-06-15 14:06:30
【问题描述】:

我正在尝试使用 CSS 设计一些标签并遵循 post。不幸的是,我无法将选定的标签字体颜色设置为黑色。

我创建了一个JsFiddle 来描述这个问题。我做错了什么?

这是 HTML:

<div id="header"> 

    <h1>Tabs</h1>
    <ul>
        <li><a href="#">This</a></li>
        <li id="selected"><a href="#">That</a></li>
        <li><a href="#">The Other</a></li>
        <li><a href="#">Banana</a></li>
    </ul>

</div> 

这是 CSS:

h1 {
    margin: 0;
    padding: 0 0 5px 0;
}

#header a {
    text-decoration:none;
}

#header ul {
    list-style: none;
    padding:0;
    margin:0;
}

#header li {
    float: left;
    border: 1px solid;
    border-color: black;
    border-top-left-radius: 3px;
    border-top-right-radius: 3px;
    padding: 2px 4px;
    /* border-bottom-width: 0; */
    margin: 2px 2px 0 0;
    background: black;
}

#header li a {
    color: white;
}

#header #selected {
    position: relative;
    /* top: 1px; */
    background: white;
}

#header #selected li a {
    color: black;
}

【问题讨论】:

    标签: html css fonts colors tabs


    【解决方案1】:

    更新 jsFiddle:http://jsfiddle.net/zK7y2/1/

    #header #selected li a {
        color: black;
    }
    

    这个地址是&lt;* id="header"&gt;&lt;* id="selected"&gt;&lt;li&gt;&lt;a&gt;

    您要选择的是&lt;* id="header"&gt;&lt;li id="selected"&gt;&lt;a&gt;

    所以使用:

    #header li#selected a {
        color: black;
    }
    

    【讨论】:

    • @JVerstry 差不多两个小时前你问了,所以一个小时后我才评论
    • 不用担心,我总是会回到我的问题中接受答案,迟早......
    猜你喜欢
    • 1970-01-01
    • 1970-01-01
    • 2012-06-22
    • 1970-01-01
    • 2012-09-07
    • 2017-11-18
    • 1970-01-01
    • 1970-01-01
    • 1970-01-01
    相关资源
    最近更新 更多