hooyantsing's Blog

P60_10_使用渐变重复绘制网站进度条

字数统计: 71阅读时长: 1 min
2020/04/13

P60 10 使用渐变重复绘制网站进度条

repeating-linear-gradient()

background:重复渐变色(线性)

65ceed0e87a04e55c0992b64f4789e0e.png

1
2
//标识位 中间点
background: repeating-linear-gradient(45deg,blue 0px,25px,yellow 25px,25px,red 50px);

repeating-radial-gradient()

background:重复渐变色(径向)

325583957e07c908eed5c4b66862023e.png

1
2
//圆心位置
background: repeating-radial-gradient(100px 100px,red,yellow 25px);
CATALOG