css下划线怎么设置长度 |css 1 4圆弧

1. 使用text-decoration属性设置下划线长度：

.text-underline{
text-decoration: underline dotted;
text-decoration-color: red;
text-decoration-thickness: 3px;
text-underline-offset: 10px;
}

以上代码可以设置文本下划线的样式、颜色、粗细和偏移量，可以根据实际需要进行调整。

2. 使用border-bottom属性设置下划线长度：

.text-underline{
border-bottom: 3px dotted red;
}

以上代码可以设置文本下方的边框样式、颜色和粗细，实现下划线的效果。同样可以根据实际需要进行调整。

3. 使用伪元素:before或:after来实现下划线的长度控制：

.text-underline:before{
content: "";
display: block;
height: 3px;
width: 50%;
background: blue;
}

以上代码可以在文本前插入一个空的块级元素，利用其背景色填充实现下划线的效果，并且可以控制该伪元素的长度。同样可以根据实际需要调整长度。

综上所述，CSS下划线的长度可以通过以上几种方式进行控制，可以根据实际需求选取适用的方法。希望本文对大家有所帮助。