您好我有这个图像我想从它做一个背景渐变，而不是把它放入CSS：

这是可能的还是我推动CSS3渐变的限制？
我并不是在寻找一个有多个div或任何类型的黑客的解决方案，只需要一个css类的渐变或重复渐变，我可以将其分配给一个元素，并为其分配所需的模式。

更新：

如果你检查上面的图片，你会看到蓝色条纹的宽度不一样，所以根据下面的@ vals的回答，2个渐变不足以拥有这个模式，我们需要7个，但是我没有意识到这种模式常规的线性渐变或重复的线条，所以我在这里丢失的是如何绘制每个带有已知宽度和高度的div的条纹，以使这个图案具有相同数量的条纹和条纹宽度。

---

您可以在同一背景中设置2个不同的渐变。 然后，您需要的只是根据需要对其进行维度定位

div {
    width: 400px;
    height: 400px;
    background-image: repeating-linear-gradient(45deg, blue 0px, blue 20px, lightblue 20px, lightblue 40px), repeating-linear-gradient(135deg, blue 0px, blue 20px, lightblue 20px, lightblue 40px);
    background-size: 100% 50%;
    background-position: top left, bottom left;
    background-repeat: no-repeat;
}

演示

链接地址: http://www.djcxy.com/p/89423.html

上一篇: is it possible to create this pattern with css3 repeating gradient?

下一篇: How do you create a tiled gradient background in Android