淘先锋技术网

首页 1 2 3 4 5 6 7

CSS中穿过文本的一条线,通常被称为“划线效果”,它可以用于装饰文本,使文本更加醒目。下面我们来介绍如何使用CSS来实现这种效果。


.text {
  text-decoration: line-through;
}

css穿过文本的一条线

如上所示,我们只需要在文本所在的元素中添加CSS样式“text-decoration: line-through;”,就可以让这段文本出现被包围在一条横线中的效果。

为了让划线效果更加优美,我们可以使用一些其他的CSS属性,例如“text-decoration-color”可以指定划线的颜色,“text-decoration-thickness”可以指定划线的粗细度,“text-decoration-style”可以改变划线的样式。


.text {
  text-decoration: line-through;
  text-decoration-color: red;
  text-decoration-thickness: 2px;
  text-decoration-style: dotted;
}

如上所示,我们将划线的颜色设置为红色,粗细度设置为2个像素,样式设置为点线式,从而使划线效果更加个性化。通过调整这些属性,我们可以轻松地实现各种划线效果。