IE中的下划线厚度不一致

Question

我希望我的锚链接的内容能够粗体和下划线，但锚标记内的跨度不应该是粗体。

示例标记：

<a>Hello, <span>fooooo</span> bar</a>

样式：

    a {
        font-weight: bold;
        text-decoration: underline;
    }

    span {
        font-weight: normal;
    }

（右键点击图片，然后在新标签中选择查看/打开以获得更好的视图）

在IE8 +中，下划线厚度不一致：显然它是由链接内粗体文本的百分比决定的。有没有办法让页面上每个链接的下划线看起来完全相同？

小提琴：http://jsfiddle.net/FfBGn/

Answer 1

有点hack-ish，但您可以使用此代替text-decoration:underline：

border-bottom:1px solid #000;

demo

---

或者，如果您必须使用text-decoration:underline， 你可以大胆地做出更大胆。

font-weight:800;

demo

Answer 2

也许更简单的方法是设置锚点的边框而不是下划线？那样你自己可以决定厚度吗？

border-bottom: 1px solid #000000;