css - 为什么text-decoration不能在a：hover下工作？

.twoColFixRt＃nav-primary .nav li a， .twoColFixRt＃nav-primary .nav li a：visited { color：＃00FF00; text-decoration：none; } .twoColFixRt＃nav-primary .nav li a span { display：block; padding：0 10px; font-size：15px; } .twoColFixRt＃nav-primary .nav li a：hover { text-decoration：underline; color：＃FF0000; }css - 为什么text-decoration不能在a：hover下工作？

Q1>我不知道为什么a：悬停在上面的代码不起作用。换句话说，当光标位于导航项目的顶部时，下划线不会显示。

但是，当将光标悬停在导航项上时，我确实看到了颜色的更改。

Q2>我正在使用DW CS4 + Firebug。有没有一种方法可以检测出哪种规则可以抑制：悬停，以便我可以在将来找出类似的问题？

谢谢

来源

2010-08-26 q0987

你可以得到文字修饰通过将其应用到嵌套跨度像这样显示出来：

.twoColFixRt #nav-primary .nav li a:hover span { 
    text-decoration: underline; 
    color:#FF0000; 
}

如果你有兴趣为它不是当前工作的原因对于您，您可以阅读this question关于包含块框（您的<span>）的内联框（您的<a>）。

至于检测哪些规则适用于某个元素，我使用Firefox的Web Developer插件。它是CSS>查看风格信息（CTRL + SHIFT + Y）对此尤其方便。

来源

2010-08-26 02:52:51 Pat

哇。显然，这只是在Firefox中必不可少的（下划线显示在原始代码中的Chrome和IE浏览器（8）http://jsfiddle.net/vUkZ6/） – 2010-08-26 03:18:13

你好帕特，你的解决方案对我来说很好。另外我安装了web开发人员，只是永远不知道如何使用它。我使用CSS->查看样式信息，但是，我没有找到抑制规则信息的地方。可以给我一点提示吗？谢谢 – q0987 2010-08-26 03:26:39

@ q0987很高兴听到。 Web开发人员没有具体列出被压制的规则。当你在'查看样式信息'时，点击任何元素，你就会得到一个所有应用样式的列表。然后，您可以查看列表并查看是否有任何内容被无意中覆盖。 – Pat 2010-08-26 03:44:33

将text-decoration属性应用到元素的内联css中。如果有效，找出你的外部CSS有什么混乱。

来源

2010-08-26 03:02:26 bogatyrjov

css - 为什么text-decoration不能在a：hover下工作？

回答

相关问题