4、斜纹背景的雏形
现在大家再把原来的0deg，改成45deg，会变成什么样子的呢？
大家应该可以看出来这已经是斜纹背景了吧。再修改一下：
CSS Code复制内容到剪贴板
body {
background-image:-moz-linear-gradient(45deg,#000 25%,transparent 25%,transparent 50%,#000 50%,#000 75%,transparent 75%);
background-size:16px 16px;
}
大家看到了什么，有没有得到令你满意的效果，修改颜色值，来达到你的目的。这里面还有一个问题，大家自己思考下吧，background-size的值需要注意什么？
5、最终效果
虽然上面的斜纹背景已经出来了，但还没有达到我们想要的最终效果。我们再把里面的颜色值修改一下，换成白色。现在的颜色值为#fff，我们把它换成rgba形式为rgba(255,255,255,1)，前面的三个数字为rgb，第四个数字为alpha，现在我们把这个alpha改成半透明的，代码如下：
CSS Code复制内容到剪贴板
body {
background-color: #eee;
background-image: -moz-linear-gradient(45deg, rgba(255, 255, 255, 0.2) 25%, transparent 25%, transparent 50%, rgba(255, 255, 255, 0.2) 50%, rgba(255, 255, 255, 0.2) 75%, transparent 75%, transparent);
background-size: 16px 16px;
}
webkit内核
1、制作一个简单的竖条纹背景
css如下， 这里的效果图可以与上面火狐版的对应起来看
CSS Code复制内容到剪贴板
body {
background-color: #eee;
background-image:-webkit-gradient(linear,0 0,100% 0,from(#fff),to(#000));
background-size: 80px 80px;
}
2、改变条纹的方向，
CSS Code复制内容到剪贴板
body {
background-image:-webkit-gradient(linear,0 100%,100% 0,from(#fff),to(#000));
}
3、添加丰富的颜色渐变
CSS Code复制内容到剪贴板
body {
background-image:-webkit-gradient(linear,0 0,100% 0,from(#fff),to(#000),color-stop(25%,#fc0),color-stop(50%,#0fc),color-stop(75%,#f0c))
