一，垂直条纹.
.linearGradient{
width:200px;
height: 200px;
background:linear-gradient(#fb3 33.3%, #58a 0, #58a 66.6%,yellowgreen 0);
background-size:100% 50px;
}
二，水平条纹：
.linearVertical{
margin-top:10px;
width:200px;
height: 200px;
background:linear-gradient(90deg,#fb3 50%, #58a 0);
background-size:30px 100%;
}
三，斜向条纹：
.linearOblique{
margin-top:10px;
width:200px;
height: 200px;
background:repeating-linear-gradient(45deg,#fb3,#58a 30px);
}
四，同色系条纹：
.linearColorsame{
margin-top:10px;
width:200px;
height: 200px;
background:#278;
background-image:repeating-linear-gradient(30deg,
hsla(0,0%,100%,.1),
hsla(0,0%,100%,.1) 10px,
transparent 0,
transparent 30px)
}
效果图：
image.png
