Question

可能重复：
How to use CSS hover inside html-tag?

<body>
   <div id="he">
      <div id="header">
         <div class="headertabs">
            <ul class="nav">
               <li class="divide">&nbsp;</li>
               <li class="tab"><a href="a.php">OVERVIEW1</a></li>
               <li class="divide">&nbsp;</li>
               <li class="tab"><a href="a.php">OVERVIEW2</a></li>
</body>

当我在overview1和overview2标签上移动鼠标（悬停）时，如何编写css，它必须将文本颜色更改为绿色。

Answer 1

Simnply使用：hover伪选择器：

li.tab a:hover
{
   color: green
}

http://jsfiddle.net/Kyle_/duj2d/

Answer 2

我从我打开的文件中抓取了一些CSS，这应该可以很好地解释它：

这是我常用的CSS锚点：

a
{
    color: #006699;
    text-decoration: underline;
}

这是在颜色悬停时改变颜色的位。

a:hover
{
    text-decoration: none;
}

Answer 3

我将悬停在<a>而不是为了更好的IE支持，我还会更改焦点的颜色，以便在通过链接进行制表时仅针对键盘的用户进行更改，所以：

.tab a:hover, .tab a:focus {
  color: green
}

Answer 4

另一种方式

li a:hover{
 color:green;
}

Answer 5

小一点：

    .tab a:hover{color:green}

如何为鼠标悬停编写CSS

5 个答案: