[css 揭秘] ：CSS揭秘 技巧（五）：条纹背景

条纹背景

https://github.com/FannieGirl/ifannie/
问题：条纹背景 在设觉设计中无处不在，咱们真的能够用css 建立图案吗？

这一章相对仍是比较复杂的哦！一块儿get.
首先咱们作一个渐变的背景

横条背景

如今咱们把这两个色标拉近一点

这样好像条纹背景 就出来了哦！不过这是横向的，是否是还能够竖线呢！确定是能够的啦，看看多变的条纹背景

竖条背景

斜向背景

这样的条纹背景仍是不够灵活的。还有更好的方案

liear-gradient() 和 radial-gradient() 还各有一个循坏的增强版：repeating-liear-gradient() 和 repeating-radial-gradient() 他们的工做方式是跟前二者相似的，可是不一样点是：色标是无线循环重复的，直到填满整个背景。

灵活的同色系条纹

通常状况下，咱们想要的条纹图案并非由差别极大的几种颜色组成的，这些颜色每每属于同一色系，只是在明度方面有着轻微的差别

实例演示地址：https://jsfiddle.net/06sjmL6n/13/

后言：
若是你对基础的知识点已经很熟悉，你能够自动跳过。写上去的缘由是查漏补缺，巩固一下基础。
若是有不对的地方，欢迎你来吐槽。
本文主要参考《CSS 揭秘》一书 以及w3school；
参考连接 ：http://www.w3school.com.cn/cssref/pr_background-clip.asp