css下划线的距离

在CSS中，给文字添加下划线可以通过text-decoration属性实现，其中下划线距离文字的间距可以通过text-underline-position属性来控制。

.text{
  text-decoration: underline;
  text-underline-position: from-font;
} 

其中text-underline-position属性有两个值，from-font和auto。from-font表示下划线距离文字的底部距离由字体本身决定。auto表示下划线距离文字的底部距离为文字的下方外边距的一半。

.text{
  text-decoration: underline;
  text-underline-position: auto;
} 

除了设置text-underline-position属性外，还可以通过line-height属性来调整下划线距离文字的距离，这也会影响到文字行高的大小。通常情况下，下划线距离文字的底部距离应与文字基线对齐，可以根据字体的特性调整。

.text{
  text-decoration: underline;
  line-height: 1.5em;
} 

总之，当需要自定义文字下划线距离时，可以通过text-underline-position、line-height等属性来实现。