Question

我创建了一个简单的例子。我想更改链接的当前颜色。这是代码：

<div id="link1">
    some content
</div>
<div id="link2">
    some content
</div>

 <div class="div1">             
    <div id="navigation">
        <ul>
          <li><a data-tab="#link1" id="link-link1"href="#link1">Link1</a></li>
          <li><a data-tab="#link2" id="link-link2"href="#link2">Link2</a></li>
        </ul>
    </div>   
 </div>

用于更改当前链接颜色的CSS代码：

#link1:target ~ .div1 #navigation #link-link1,
#link2:target ~ .div1 #navigation #link-link2
{
    background: #000;
    color: #fff;
}

这有效，但我需要在

之前定义链接

<div id="link1">
    some content
</div>
<div id="link2">
    some content
</div>

在它没有改变链接的当前颜色后，我尝试了.div1 #navigation #link-link1 ~ #link1:target和.div1 #navigation #link-link1 #link1:target。

它仍然无效。

Answer 1

请记住，链接具有非常特定的CSS代码（a：链接a：visited：a：active a：hover），您只需更改类。如果您想要各种链接的不同样式，请尝试使用此代码

.class1 A:link {put styles here} 
.class1 A:visited {put styles here} 
.class1 A:active {put styles here}
.class1 A:hover {put styles here}

.class2 A:link {put styles here} 
.class2 A:visited {put styles here} 
.class2 A:active {put styles here} 
.class2 A:hover {put styles here}

等等。对于html部分，只需使用＆lt; div class =“class1”＆gt;＆lt; a href =“blah”＆gt; text＆lt; / a＆gt;＆lt; / div＆gt;

祝你好运：）

Answer 2

修复十六进制颜色，它们不正确。

更改

#000

要

#000000

总是6个数字

建议：不要使用css，你不会需要它。

改为使用：

<div id="link2" style="color:#40B3DF;">
    <p> some content </p>
</div>

这给出了蓝色文字。将＃40B3DF更改为#FFFFFF

或者如果你需要使用css：

{
    background: #000000;
    color: #ffffff;
}

不能改变当前的链接颜色和背景

2 个答案: