语法：linear-gradient(direction, color-stop 1, color-stop 2,……)

简单用法：background-image: linear-gradient(red, transparent);

增加角度，linear-gradient(45deg, red, transparent)

加个position：linear-gradient(45deg, red, transparent 45%)

加个colorlinear-gradient(45deg, red, transparent 45%,red)

linear-gradient(45deg, transparent 45%, red 55%, transparent 60%)

linear-gradient(135deg, transparent 45%, red 55%, transparent 60%)

把这两个线结合达到波浪线效果

DOCTYPE html>

Documenttitle>

}.down:after{content:'';position:absolute;bottom:-2px;left:5%;width:90%;height:2px;background:-webkit-linear-gradient(315deg, transparent, transparent 45%, red 55%, transparent 55%, transparent 100%)

,-webkit-linear-gradient(45deg, transparent, transparent 45%, red 55%, transparent 55%, transparent 100%);background-size:4px 4px;background-repeat:repeat-x;

}

style>

head>

燃情岁月span>

body>

html>

示例：

红色下划线

红色下划线