CSS是前端开发不可或缺的技术，它可以让网页的样式更加美观。而使用纯CSS样式在文本中创建波浪线效果也是十分简单的。简单写个教程记录下如何使用CSS样式来创建波浪线/下划线效果（以免下次自己忘记了），同时也给需要同学提供一丢丢帮助吧！！

CSS样式属性text-decoration解释

text-decoration 这个CSS属性是用于设置文本的修饰线外观的（波浪线、下划线、上划线、贯穿线/删除线）

CSS样式属性text-decoration用法

在CSS样式表添加样式，例如添加如下样式参数，然后网页页面调用添加的样式

波浪线使用方法

.wavy{
    text-decoration: underline wavy;
}

下横线使用方法

.under{
    text-decoration: underline;
}

删除线使用方法

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

链接没有下横线使用方法

.plain {
  text-decoration: none;
}

文字下面和上面都有虚线使用方法

.underover {
  text-decoration: dashed underline overline;
}

效果图

CSS样式属性text-decoration其他参数用法

text-decoration-color:#0284dc;//下划线颜色

text-underline-offset: 10px;//下划线和文字间距

效果图