鼠标悬停仅在 Firefox 中不起作用
在花了几个小时之后，我尝试并隔离了下面的问题。第一个链接在 FF 中悬停时没有下划线，但在我尝试过的所有其他浏览器中都有效。第二个链接在 Firefox 中也可以正常工作。网站上大多数现有的 html 都是按以下方式构建的，因此我们将不胜感激网站范围内的修复。
HTML： （在此处粘贴为代码会删除标签） http://pastebin .com/duqfKGeY
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<title>
FF test
</title>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8"/>
<link href="ff.css" rel="stylesheet" type="text/css" />
</head>
<body>
<table>
<tbody>
<tr>
<td>
<ul type="disc">
<li>
<a target="_blank" href="http://example1.com">
<font size="2" color="#b80000"><b>Example Link 1</b></font></a>
<br>
<font size="2" face="Verdana">
example text example text example text example text example text example text example text example text example text example text example text example text example text example text example text example text example text
<a target="_blank" href="http://example2.com/">
<font size="2" face="Verdana" color="#b80000">Example link 2</font>
</a>
example text example text example text example text example text example text example text example text example text example text example text example text example text example text example text example text example text .
</font>
</li>
</ul>
</td>
</tr>
</tbody>
</table>
</body>
</html>
CSS:
a{color:#b80000;}
a:link{color:#b80000;text-decoration:none;}
a:visited{color:#b80000;text-decoration:none;}
a:hover{color:#b80000;text-decoration:underline;}
a:active{color:#b80000;}
编辑：在 W3C 验证器上验证没有任何错误
I have tried and isolated the problem below after spending hours on this. First link is not underlined on hover in FF but works in all the other browsers I have tried. The second link properly works in Firefox too. Most of the existing html on the site is structured in the below way so a site wide fix will be appreciated.
HTML: (pasting as code here removes tags) http://pastebin.com/duqfKGeY
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<title>
FF test
</title>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8"/>
<link href="ff.css" rel="stylesheet" type="text/css" />
</head>
<body>
<table>
<tbody>
<tr>
<td>
<ul type="disc">
<li>
<a target="_blank" href="http://example1.com">
<font size="2" color="#b80000"><b>Example Link 1</b></font></a>
<br>
<font size="2" face="Verdana">
example text example text example text example text example text example text example text example text example text example text example text example text example text example text example text example text example text
<a target="_blank" href="http://example2.com/">
<font size="2" face="Verdana" color="#b80000">Example link 2</font>
</a>
example text example text example text example text example text example text example text example text example text example text example text example text example text example text example text example text example text .
</font>
</li>
</ul>
</td>
</tr>
</tbody>
</table>
</body>
</html>
CSS:
a{color:#b80000;}
a:link{color:#b80000;text-decoration:none;}
a:visited{color:#b80000;text-decoration:none;}
a:hover{color:#b80000;text-decoration:underline;}
a:active{color:#b80000;}
Edit: Validates without any errors on W3C Validator
如果你对这篇内容有疑问，欢迎到本站社区发帖提问 参与讨论，获取更多帮助，或者扫码二维码加入 Web 技术交流群。
绑定邮箱获取回复消息
由于您还没有绑定你的真实邮箱，如果其他用户或者作者回复了您的评论，将不能在第一时间通知您！
发布评论
评论（5）
标签覆盖text-decoration。只需添加以下内容：如果还有其他您甚至可以这样做：
The
<B>tag is overriding thetext-decoration. Just add this:If there are others you could probably even do:
这有点过头了，我只想使用：
a{text-decoration:none;}
a:hover{text-decoration:underline;}
这应该没有理由不起作用。
This is all a bit over kill I would just use:
a{text-decoration:none;}
a:hover{text-decoration:underline;}
There should be no reason why this doesn't work.
好吧，首先，
布局表格 - 请自学：
http://shouldiusetablesforlayout.com
http://www.hotdesign.com/seybold/
http://webdesign.about.com/od/layout/a/aa111102a.htm
http://www.htmlgoodies.com/beyond/css/article.php/3642151/CSS- Layouts-Without-Tables.htm
标签很久以前就已被弃用，我们现在使用 CSS 和标签来满足我们所有的样式需求。东西不起作用的最可能的原因是因为你的 HTML 基本上是完全错误的，是的，它可以工作，但它正在杀死 interwebz - 这是使用
标签和 CSS 重做的布局 -漂亮干净，每个人都很高兴：现场演示
另外 - 验证 - 它只是一个工具，而不是一个值得追求的标准，当然它有助于找出错误，但最终可能会导致您在尝试 100% 兼容时遇到麻烦（盯着 XHTML Strict）更多信息请参见此处：
http://net.tutsplus.com/articles/general/but-它不验证/
Okay first things first,
Tables for layout - educate yourself please:
http://shouldiusetablesforlayout.com
http://www.hotdesign.com/seybold/
http://webdesign.about.com/od/layout/a/aa111102a.htm
http://www.htmlgoodies.com/beyond/css/article.php/3642151/CSS-Layouts-Without-Tables.htm
<font>tags were deprecated LONG ago, we now use CSS and<span>tags for all our styling needs.The most likely reason why stuff doesn't work is because your HTML is basically completely wrong, yes it works but it is killing the interwebz - Here is your layout redone with
<div>tags and CSS - nice and clean and everyone is happy:Live Demo
Also - validation - It is just a tool, not a standard to aspire to, sure it helps fish out bugs but it could end up causing you hassle trying to be 100% compliant (Stares at XHTML Strict) more on that here:
http://net.tutsplus.com/articles/general/but-it-doesnt-validate/
我在 FF 3.6/Mac 中的两个链接上看到 :hover 下划线，即使它们是被访问的链接。
正如 Alex Thomas 指出的，你的 CSS 可以更简洁——考虑所有链接状态都是相同的颜色，只有 :hover 状态有下划线不同。
即使来自 Google Docs 的糟糕 HTML 的颜色在那些
font标签上注明（复古，呃？），请在 CSS 中复制颜色规则，以便 :hover 下划线以正确的颜色显示：I see the :hover underline on both links in FF 3.6/Mac, even when they are visited links.
As Alex Thomas pointed out, your CSS can be more concise--consider that all the link states are the same color, and only the :hover state differs by having an underline.
Even though the crummy HTML from Google Docs has the color stated on those
fonttags (retro, eh?), duplicate the color rule in your CSS so the :hover underline appears in the correct color:问题可能出在
text-decoration: underline;CSS 语句上。 Firefox 在 3.6 版本中忽略了这一点。我知道到 7.0 版本它就可以正常工作了，但我不知道它是什么时候真正修复的。您使用的是哪个版本的 Firefox？
The problem may be with the
text-decoration: underline;CSS statement. Firefox ignores this in version 3.6. I know by version 7.0 it works just fine, but I don't know when it was actually fixed.What version of Firefox are you working with?