没有图像的CSS斑马条纹背景

Question

可以使用 css 在不使用图像的情况下将斑马条纹作为背景吗？

Answer 1

是的，你可以，用类似的东西

ul li {
   background-color: #fff;
}

ul li:nth-child(even) {
   background-color: #efefef;
}

参见:
http://reference.sitepoint.com/css/pseudoclass-nthchild
http://reference.sitepoint.com/css/understandingnthchildexpressions

---

编辑

你真的应该清楚地说明你所说的斑马带是什么意思;)

如果您需要不使用图像的渐变背景，请参阅:

http://www.webdesignerwall.com/tutorials/cross-browser-css-gradient/

基本上，您将使用的语法类似于:

background-image: -moz-linear-gradient(left, #fff, #999);
background-image: -webkit-gradient(linear, #fff, #999);

参见:
https://developer.mozilla.org/en/CSS/-moz-linear-gradient
http://webkit.org/blog/175/introducing-css-gradients/

更多详情