HTML – 使用css更改下划线颜色在chrome中不起作用？

我试图在使用跨度的悬停事件期间更改下划线颜色,它适用于IE9和Firefox 13.01但它在Chrome中不起作用(它应该以黄金下划线).

#menu li：hover span.underline {
    文字装饰：下划线;
    颜色：#FAA301; }

< ul id =“menu”>
    < li style =“z-index：7;”>< span class =“underline”>< a href =“#”> link1< / a>< / span>< / li>
    < / UL>

这是js.fiddle：http://jsfiddle.net/wuUpL/7/.

我最初从这篇文章https://stackoverflow.com/a/1175402/1490248中得到了这个想法,但那个也不适用于chrome.

注意：我不想使用边框来修复此问题,我已经将边框用作边框

有人可以帮我从这里出去吗？是否有某种铬破解/异常我可以用来解决这个问题？

最佳答案

我知道你说你不想在这里使用边框,但是你发现两个浏览器之间的东西不一样.

您可以通过添加内部跨度并在其上使用边框来使其在Chrome上运行.

http://jsfiddle.net/wuUpL/10/

对不起,如果不是你的想法,但Gecko和WebKit不同意这里的事情！