带有斜杠的进度条

线性渐变

background:-webkit-linear-gradient(-45deg,red 0px,red 10px,green 10px,green 20px);

径向渐变

 background:-webkit-radial-gradient(circle,yellow 50px,red 50px);

重复线性渐变

background:-webkit-repeating-linear-gradient(-45deg,red 0px,red 10px,green 10px,green 20px);

例子

css

div{
       background:-webkit-repeating-linear-gradient(-45deg,pink 0px,pink 10px,yellow 10px,yellow 20px);height:60px;
            }

html

效果图

20170721163856.png