Question

hei everyone :)所以我正在制作这个菜单，一切都很完美，直到我点击链接创建一个新网站。然后链接变为活动状态，然后我将鼠标悬停在链接上。它应该得到你在悬停时得到的背景颜色和文字颜色。它似乎不起作用。

背景颜色仍然相同，但文字颜色只是保持黑色而不是变化。如果我在文本激活时更改文本的颜色，那么即使我没有悬停，文本也会保持该颜色。它只会在它徘徊时改变。

我在css中的菜单代码：

.link{
float:left; 
text-decoration:none; 
color:#000000;
font-size:19px;
background:opacity:0.4;
width:130px;
padding-bottom:8px;
padding-top:8px;
padding-right:25px;
text-align:left;
padding-left:8px;
border-bottom:1px solid black;
border-top:1px solid black;
color:black;
line-height:1.5;
overflow:hidden;
text-align:left;

-webkit-transition: all 1s ease;  
}

a:link:hover
{
background-color:black;
color:#18ffec;}

html中的相关代码：

<div id="linki">

<p>

<a class="link" href="Index.html"> Hjem</a>
<a class="link" href="Guider.html"> Guider</a>
<a class="link" href="Om_oss.html"> Om oss</a>
<a class="link" href="Kontakt.html"> Kontakt oss</a>
<a class="link" href="Hjelp til"> Hjelp til </a>

</p>
</div>

欣赏任何答案：）

Answer 1

您指定的类错误，请使用“。”而不是“：”

a.link:hover

Answer 2

我认为你的意思是

a.link:hover

而不是

a:link:hover

Answer 3

您应该使用班级名称：

.link:hover
{
   background-color:black;
   color:#18ffec;
}

:link是一个“正常的，未经访问过的链接”，所以当它被访问时，悬停将无效。在这种情况下，a.link不需要只使用类名。

链接处于活动状态时，悬停效果不起作用

3 个答案: