0

我已经在 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;   
}

这是我的 HTML：

<ul id="already-set">                               
  <li><a href="#" id="active"> List Item </a></li>
</ul>
4

2 回答 2

4

你对a:active.

请检查此示例，这将使其更加清晰。我添加了 jQuery 以在单击时动态更改活动元素。

$(function() {
  $("a").click(function() {
    // remove classes from all
    $("a").removeClass("active");
    // add class to the one we clicked
    $(this).addClass("active");
  });
});
#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;
}
<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<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>

由于列表中的 css，文本颜色保持黑色。如果您想将所选元素中的文本颜色更改为白色，请进行以下更改，如示例 2

更改a.active为#already-set li a.active。

于 2013-08-29T05:16:43.560 回答
1

改成这个a#active可以a:active解决你的问题。

于 2013-08-29T05:15:01.957 回答