css文字下划线能设置距离

html-css018

css文字下划线能设置距离,第1张

有时候UI设计的时候文字下方会有一个下划线，所以我们经常用 text-decoration:underline 来设置一个下划线，但是呢，发现这个下划线和文字特么的重合了，来没法设置，只能用别的方法代替了，啪啪啪的写一大堆css

现在宣布： 春天来了: text-underline-offset

这个css可以设置距离文字的距离，百分比，还有一个注意点就是一定要和 text-decoration:underline 一起使用，否则不起作用，下面看一个例子

html

css

嗯，这个只要参照下面的写法就ok了。

a{

text-decoration:none

border-bottom:1px solid #ccc/* #ccc换成链接的颜色 */

display: inline-block

padding-bottom:10px /*这里设置你要空的距离*/

}