html - 文字和下划线之间的间距

我正在寻找一种扩大页面上文本和下划线之间距离的方法。我主要使用CSS，但是我也必须使用标签，基本上我的问题考虑了这两种情况。有没有办法改变这个间距？代码很简单:

.title_span {
 font-weight: bold;
 text-decoration: underline;
 color: grey;
}

我的另一种可能性是尝试使用1px图片以某种方式使用背景作为跨度，并在X轴上重复一次，我正在寻找更清洁的解决方案。

最佳答案

不是没有技巧，没有。一种简单的解决方案是将文本包装在另一个跨度中，并给其底边框。

<span class="underline"><span class="title_span">title of something</span></span>

.title_span {
 font-weight: bold;
 text-decoration: underline;
 color: grey;
}

.underline {
    padding-bottom: 2px;
    border-bottom: grey 1px solid;
}

http://jsfiddle.net/m9RQ9/