5-3 斜向条纹

I liner-gradient实现

   .box{
        width: 230px;
        height: 160px;
        background: linear-gradient(45deg,
                #fb3 25%, #58a 0, #58a 50%,#fb3 0, #fb3 75%, #58a 0);
        background-size: 30px 30px;
    }
上面#fb3 25%表示从0-25%区域是实色。#58a 0, #58a 50%等价于#58a 25%, #58a 50%，表示从25-50%区域从#58a渐变至#58a，等于实色。#fb3 0, #fb3 75%等价于#fb3 50%, #fb3 75%，表示从50-75%区域为从#fb3渐变至#fb3，等于实色。最后#58a 0等价于#58a 75%，表示从75%开始全都是实色。

II repeating-linear-gradient

background: repeating-linear-gradient(45deg,#fb3, #58a 30px);

background: repeating-linear-gradient(30deg,#fb3, #fb3 15px, #58a 0, #58a 30px);

III 同色系条纹

background: repeating-linear-gradient(30deg, #79b,#79b 30px,#58a 0,#58a 50px);

||

background: #58a;
background-image: repeating-linear-gradient(30deg,
 hsla(0,0%,100%,.1),
 hsla(0,0%,100%,.1) 15px,
 transparent 0, transparent 30px);