[分享]css中怎么把下划线往下移

在CSS中，下划线是文本装饰之一。有时候我们可能需要调整下划线的位置，让它更符合设计要求。那么，在CSS中，怎么才能把下划线往下移呢？首先，需要了解一下下划线的默认位置。下划线的默认位置是在文本的基线...

在CSS中，下划线是文本装饰之一。有时候我们可能需要调整下划线的位置，让它更符合设计要求。那么，在CSS中，怎么才能把下划线往下移呢？
首先，需要了解一下下划线的默认位置。下划线的默认位置是在文本的基线上方一点，这个位置是由字体和字号决定的，不同字体和字号的位置也会有所不同。
如果想要把下划线往下移，可以通过设置文字的行高来实现。行高指的是一行文本的高度，它包括文字的高度和行距。如果我们把行高设置成大于字体高度的数值，就能让下划线往下移。
下面是一个例子，展示如何在CSS中把下划线往下移。我们使用了p标签包裹文本，并给p标签设置了行高和下划线。

p {
  font-size: 16px;
  line-height: 2;
  text-decoration: underline;
  text-decoration-color: red;
} 

上面的代码中，line-height的值为2，表示行高是字体大小的两倍。text-decoration用来设定文本装饰，text-decoration-color用来设定下划线的颜色。通过这些设置，我们就可以让下划线往下移了。
需要注意的是，如果文本中有多行，每行都会受到行高的影响。因此，在设置行高时，需要做好对齐和排版的处理，避免影响文本的可读性。