我已经将列表中锚标记的文本颜色设置为CSS文件中的BLACK。现在我想将列表项声明为活动并更改其文本颜色,但它不起作用。请帮忙!
这是预设颜色:
#already-set li a
{
font: normal 14px Arial;
border-top: 1px solid #ccc;
display: block;
color: black;
text-decoration: none;
line-height:26px;
padding-left:5px;
}
这是更改活动列表项颜色的代码:
a#active
{
background-color: #d11250;
color: white;
font-weight:bold;
}
这是我的HTML:
<ul id="already-set">
<li><a href="#" id="active"> List Item </a></li>
</ul>
答案 0 :(得分:4)
您对a:active
...
请检查此 EXAMPLE ,这将使其更加清晰。我点击了jQuery来动态更改活动元素。
HTML
<ul id="already-set">
<li><a href="#" > List Item 1</a>
</li>
<li><a href="#" class="active"> List Item 2</a>
</li>
<li><a href="#" > List Item 3</a>
</li>
</ul>
JS
$(function() {
$("a").click(function() {
// remove classes from all
$("a").removeClass("active");
// add class to the one we clicked
$(this).addClass("active");
});
});
CSS
#already-set li a {
font: normal 14px Arial;
border-top: 1px solid #ccc;
display: block;
color: black;
text-decoration: none;
line-height:26px;
padding-left:5px;
}
a.active{
background-color: #d11250;
color: white;
font-weight:bold;
}
编辑2
由于列表中的css,文本颜色保持黑色。如果您要在所选元素中将文字颜色更改为白色,请按照 EXAMPLE 2
进行以下更改将a.active
更改为#already-set li a.active
这会解决您的问题吗?
答案 1 :(得分:1)
将a#active
更改为a:active
这将解决您的问题。