答：悬停不起作用 [英] a:hover not working

问题描述

HTML

 < table width =100％> 
< tr> 
< td width =90％>< / td> 
< td>< a href =＃id =注销>< strong>注销< / td> 
< / tr> 
< / table> 
  

CSS

  @charsetutf-8; 
 / * CSS文档* / 
 
 #logout {
颜色：#BBB; 
} 
 
 a：hover {
 color：#FFF; 
} 
  

尽管注销的颜色看起来像是css中给出的，当我将鼠标放在链接（白色）上时，颜色不会改变。原因是什么？

我必须告诉其他css文件，当鼠标放在它们上面时，它们会改变链接的颜色，并且它们工作正常。 / p>

解决方案

一个id选择器（ #logout ）更具体，选择器（ a ）加上一个伪类（：hover ），所以你的第一个规则集总是运行级联。

使用 #logout：hover 改为。

HTML

 <table width="100%">
<tr>
    <td width="90%"></td>
    <td><a href="#" id="logout"><strong>Logout</strong></a></td>
 </tr>
</table>

CSS

@charset "utf-8";
/* CSS Document */

#logout {
color:#BBB;
}

a:hover {
color:#FFF;
}

Though the color of logout appears to be what is given in the css , the color doesn't change when i place my mouse over the link (to white) . What is the reason ?

I must tell there are other css files that tend to change the color of the link when the mouse is placed over them and they work fine.

解决方案

An id selector (#logout) is more specific then a type selector (a) plus a pseudo-class (:hover), so your first ruleset will always win the cascade.

Use #logout:hover instead.

这篇关于答：悬停不起作用的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！