CSS下划线文本，其中下划线的权重小于文本？

尝试在标题下划线，但将其作为比其上方粗体文本细得多的行，我如何做到这一点

从“谷歌搜索”的答案来看，这应该是可行的（但事实并非如此）：

基本转移

所以，简单回顾一下，大文本，细下划线，如何

或者更重要的是，我错在哪里

---

谢谢，底框怎么样

<h2 style="border-bottom:1px solid #000;">basic transfer</h2>

基本传输

---

当然，您不应该使用内联css。

meder的答案是一个很好的通用方法，但要小心：对于

h2

和其他块元素，使用边框模拟下划线不会很有效。如果文本换行，则仅边界框的底部边缘将加下划线。即使没有，边框也会延伸到文本末尾的右侧。您需要将文本包装在一个跨距中，并设置跨距的样式

<h2><span style="border-bottom:1px solid #000;">basic transfer</span></h2>

基本传输

我算出来了。：）

如果在li中使用链接，则可以使用以下类型的css：

HTML:

这将使链接下的行变细，而链接文本本身变粗

---

：）

唯一的问题是“边框”的下划线有点低，有没有办法解决这个问题？嗯？底部填充物？你能给我展示一下你想要的结果吗？我讨厌猜测你想要什么。

文本装饰：下划线

或

应该在文本的基线中添加下划线，允许

p

和

g

等字母的下一个字母位于下划线下方。在底部添加边框会在下方添加边框，该边框太低，无法作为适当的文本下划线。粗体下划线问题似乎是由于Arial字体造成的。但是你的示例/解决方案适合我（Firefox18）

<h2><span style="border-bottom:1px solid #000;">basic transfer</span></h2>

<li><a href="#">Inspiration</a></li>

#theMenu li{
    font-weight: 100;
    text-decoration: underline;
    color: red;
    font-size: 0.94em;
}

#theMenu a{
    text-decoration: none;
    font-weight: bold;
}