CSS实现同色系条纹
在大多数情况下，我们使用的条纹并不是颜色相差较大的几种颜色组成的，往往是属于同色系的。例如实现下图所示的条纹图案
实现方式：
background: repeating-linear-gradient(30deg,
#79b, #79b 30px,
#58b 0, #58b 60px);不足：使用了两个同色系的颜色，想要改变这个条纹的主色调，需要修改4个地方，也没能体现出这两个颜色之间的关系。
更好的实现思路：将深色作为背景色、同时把半透明白色的条纹叠加在背景之上得到浅色的条纹。
background: #58b;
background-image: repeating-linear-gradient(30deg,
hsla(0,0%,100%,.2),hsla(0,0%,100%,.2) 30px,
transparent 0, transparent 60px);优点：
1. 当要改变背景主色调的时候，只需要修改一处；
2. 对于不支持CSS渐变的浏览器来说，背景色可以起到回退的作用。