css – 多行点缀或虚线文本下划线

前端之家收集整理的这篇文章主要介绍了css – 多行点缀或虚线文本下划线前端之家小编觉得挺不错的,现在分享给大家,也给大家做个参考。
因为CSS文本下划线只允许一个实线,它的位置正好在字符串的底部,我使用边框底部加一点填充来实现点缀或虚线文本下划线。
h2{border-bottom:1px dotted #999; padding-bottom:5px;}

现在,问题是,当标题(或段落,或任何元素)文本需要2行或更多文本时,虚线的下划线只会执行每个边框所做的任何事情,而这一点保留在块元素的底部。如果我使用文本下划线样式,下划线将保留文本,但文本下划线只支持实线,据我所知,没有填充。

那么如何用虚线或虚线下划线显示多行文本?

谢谢

解决方法

h2 {
  border-bottom: 1px dashed #999;
  display: inline;
}

所以你收到你需要的东西。但是你必须记住,< h2>然后(当然)不再是块元素。但是,您可以通过将< h2>在< div>中。

猜你在找的CSS相关文章