更改链接下划线颜色＆amp;不是字体颜色（底部边框不适用于所有浏览器）

Question

更改border-bottom属性以及删除文本修饰会在某些浏览器中创建彩色下划线（我肯定可以保证FF 5和6）。但是其他浏览器（至少Safari和Chrome）不显示任何行。

有关问题的示例，请参阅utsarotaract.org（索引页的底部段落中有一个链接）。

由于我在其他地方看过这个工作，我假设我的一些CSS发生了冲突，但我对这个问题究竟在哪里感到难过。

Answer 1

问题在于边框的大小。将您的0.5px边框更改为1px，它会起作用。实例：http://jsfiddle.net/tw16/WcrNA/

.content a {
    border-bottom: 1px solid #A80532; /* instead of 0.5px */
    color: #000022;
    text-decoration: none;
}

Answer 2

您可能想要使用：

<a><span>I'm a link</span></a>

使用以下CSS：

a {
  color: blue;
}
span {
  color: green;
}

替代方案是使用边框底部。它也是一个跨浏览器的解决方案。您只需设置其填充/边距/行高，即可使浏览器与浏览器保持一致。