我想对链接使用边框底线(而不是文本装饰下划线)。
但我需要让线条更靠近文本。负填充是不可能的,那么我该怎么办?这是一个例子:
a {
color: #245fc1;
position: relative;
border-bottom: 1px solid #245fc1;
padding-bottom: 0px;
text-decoration: none;
}
<a href="#">i want the line to be nearer</a> on the text
<bR/> because if i write in second line the bottom line from above is too close.
<bR/> using text-decoration: underline is not an option for me!
如果您将链接设置为display:inline-block;
,您将能够设置较小的行高(小于 1)并移动底部边框更靠近文本 :
a {
color: #245fc1;
display: inline-block;
line-height: 0.7em;
position: relative;
border-bottom: 1px solid #245fc1;
padding-bottom: 0px;
text-decoration: none;
}
<a href="#">I want the underline to be closer</a> to the text<br/>because if I write in second line the bottom line from above is too close. <br/>using text-decoration: underline is not an option for me!
本文内容由网友自发贡献,版权归原作者所有,本站不承担相应法律责任。如您发现有涉嫌抄袭侵权的内容,请联系:hwhale#tublm.com(使用前将#替换为@)