悬停时更改div标签内文本的字体颜色

Question

当用户将鼠标悬停在文本上时，我试图更改文本的颜色并在其下划线。

我尝试了以下操作，但不起作用。 我确实在整个互联网上寻找解决方案，但没有找到适合自己特定需求的解决方案。

<style type="text/css">
    .container{ width: 100px; float: left; background: #e2edf9; overflow: hidden; }
    .content {width: 10px; height:20px; cursor: pointer; color: black; }
    .content:hover{color: orange;}
</style>

<div class="container">
    <div class="content" onclick="search(this)" >**EWR**</div>
    <div class="content" onclick="search(this)" >**NRT**</div>
</div>

Answer 1

CSS：

.container{ width: 100px; float: left; background: #e2edf9; overflow: hidden; }
.content {width: 10px; height:20px; cursor: pointer; color: #000000; }
.content:hover{color: #FFA500; text-decoration: underline;}

并非所有的浏览器都接受单词，因为颜色尝试使用HEX代码或rgb（）。

请参阅： http ： //jsfiddle.net/davcpas123/3S4xN/2/

更新：

对我来说，奇怪似乎很好：

Answer 2

在IE中，必须声明一个<！DOCTYPE>，以便：hover选择器可以在<a>元素以外的其他元素上工作。

我不确定：hover是否支持<IE6中的链接以外的其他元素。

如果推推推，总是有你的JavaScript鞭子：

<div class="content" onmouseover="this.style.color = 'orange'" onmouseout="this.style.color = 'black'" ></div>

Answer 3

这怎么了

<style type="text/css">
    .container{ width: 100px; float: left; background: #e2edf9; overflow: hidden; }
    .content {width: 10px; height:20px; cursor: pointer; color: black; }
    .content:hover{color: #FFFFFF;text-decoration:underline;}
</style>

<div class="container">
    <div class="content" onclick="search(this)" >**EWR**</div>
    <div class="content" onclick="search(this)" >**NRT**</div>
</div>​

演示： http ： //jsfiddle.net/m4m7B/1/

Answer 4

这个小提琴在IE8中对我有用， 请看这里的小提琴 ，除了在怪癖模式下运行时，您是否启用了怪癖模式？

是javascript的一个选项，似乎是最适合您的解决方案。