多线虚线或虚线文本下划线 [英] multi line dotted or dashed text-underline
问题描述
因为CSS文本下划线只允许一个实线,它的位置是在字符串的底部,我使用边框底部加一点填充,以实现虚线或虚线文本下划线。
h2 {border-bottom:1px dotted#999; padding-bottom:5px;}现在,问题是,当标题(或段落或者无论什么元素)文本需要2行或更多,虚线下划线只是做每个边框做,这是留在块元素的底部。如果我使用文本下划线样式,下划线保留文本,但文本下划线只支持实线,据我所知,没有填充。
感谢
解决方案 div> h2 {
border-bottom:1px dotted#999;
display:inline;
}
所以你收到你所需要的。
必须记住,< h2>
然后(当然)不再是块元素。但是你可以通过在< div>
中放置< h2>
>
Because CSS text underline only allows a solid line and its position is right at the bottom of strings, I'm using border-bottom plus a little padding to achieve dotted or dashed text underline.
h2{border-bottom:1px dotted #999; padding-bottom:5px;}
now, the problem is, when the heading (or paragraph, or whatever element) text takes 2 lines or more, the dotted underline simply does what every border does, which is stay on the bottom of the block element. If I use text-underline style, the underline stays with the text, but text-underline only supports a solid line, and as far as I know, no padding.
So how do I display multi line texts with dotted or dashed underline ?
Thanks
解决方案 h2 {
border-bottom: 1px dashed #999;
display: inline;
}
So you receive what you need.
But you have to keep in mind that <h2>
is then (of course) no longer a block element. But you can "avoid" that by putting a <h2>
in a <div>
.
这篇关于多线虚线或虚线文本下划线的文章就介绍到这了,希望我们推荐的答案对大家有所帮助,也希望大家多多支持IT屋!
查看全文