具体代码如下
.wavy-line-decoration {
position: relative;
line-height: 1.5em;
}
.wavy-line-decoration::before {
content: '';
position: absolute;
bottom: -3px;
width: 100%;
height: 0.25em;
background: // 可以给同一个元素同时添加多个背景渐变图层,用逗号隔开,要编辑不同渐变图层的的background-repeat 和 background-size等同理,用逗号隔开
linear-gradient(45deg, transparent, transparent 45%,red 45%, red 55%,transparent 55%, transparent 100%),
linear-gradient(135deg, transparent, transparent 45%,red 45%, red 55%,transparent 55%, transparent 100%);
background-size: 0.5em 0.5em;
background-repeat: repeat-x, repeat-x;
}
Document我是一些带波浪线的文字信息
呈现的效果如下图
QQ图片20210706215125.png