在悬停时更改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中，必须声明一个＆lt;！DOCTYPE＆gt; for：hover选择器用于处理除＆lt; a＆gt;之外的其他元素元件。

我不太确定：将悬停支持放在＆lt; 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 see fiddle here中适用于我，除非在怪癖模式下运行时，你是否有怪癖模式？

javascript是一个选项，对你来说似乎是最好的解决方案。