html如何在文字两边添加水平线并设置长度

可以使用CSS的伪元素`::before`和`::after`来在文字两边添加水平线，并设置其长度。以下是一个例子：

<p class="text-with-line">这是一段文字</p>

在CSS中定义`.text-with-line`类，如下所示：

.text-with-line {
  position: relative;
}

.text-with-line::before,
.text-with-line::after {
  content: "";
  position: absolute;
  top: 50%;
  width: 30%;
  height: 1px;
  background-color: red;
}

.text-with-line::before {
  left: 0;
  transform: translateY(-50%);
}

.text-with-line::after {
  right: 0;
  transform: translateY(-50%);
}

以上代码将在文字的左右两边添加红色水平线，其长度为文字宽度的30%。可以通过调整width属性的百分比值，来控制水平线的长度。