5-1 水平条纹

I 等宽条纹

.box{
        width: 230px;
        height: 160px;
        background: linear-gradient(#fb3 50%,#58a 50%);
        background-size: 100% 50px;
    }

II 不等宽条纹

background: linear-gradient(#fb3 30%, #58a 0);
background-size: 100% 30px;

III 多种颜色条纹

  .box{
        width: 230px;
        height: 160px;
        background: linear-gradient(#fb3 33%,
        #58a 0, pink 66%, yellowgreen 0);
        background-size: 100% 50px;
    }