html - 重复单个 CSS 对象

Question

我想用纯CSS制作一个类似斑马的图案。一个工作有多个跨度实例来生成重复。 Here is the code .

<div id="wrap">    
 <span class="one"></span>
 <span class="two"></span>
 <span class="three"></span>
 <span class="four"></span>
 <span class="five"></span>
</div>

​ 我知道使用 x 重复条纹会更容易，但我想知道是否可以使用纯 CSS 制作而不使用 <span> 的多个实例或<div>像:

<div id="wrap">    
 <span></span>
</div>

#wrap span {
 background: #000;
 /* stripe shape coordinates */

 repeat: x-repeat; /* something like this */
}

Answer 1

我认为这个thread是您正在寻找的内容，特别是类似 this 的内容。它是用来制作图案的 css3 渐变。基本上，您为背景创建一个图案，然后让该图案重复。但是，较旧的浏览器将无法工作，但我不知道这是否是一个问题。