html – 文本和下划线之间的间距

发布时间：2020-12-14 16:35:13 所属栏目：资源来源：网络整理

导读：我正在寻找一种方法来扩大文本和页面下划线之间的距离.我主要使用CSS,但我也必须使用标签,基本上我的问题考虑了两种情况.有没有办法改变这个间距？代码很简单： .title_span { font-weight: bold; text-decoration: underline; color: grey;} 我的另一个可能

我正在寻找一种方法来扩大文本和页面下划线之间的距离.我主要使用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/

（编辑：李大同）

【声明】本站内容均来自网络，其相关言论仅代表作者个人观点，不代表本站立场。若无意侵犯到您的权利，请及时与联系站长删除相关内容!