如何使用HTML和CSS创建倾斜的条纹设计

Question

是否可以使用HTML和CSS创建图像中显示的设计？如果是的话那我还需要做什么？

图像被放大，这就是它看起来像素化的原因。倾斜的线条覆盖在具有不同背景（白色和蓝色）的不同元素的顶部。这些线条最后也融入了背景。

Answer 1

您可能想要为顶部和底部元素使用两个不同的背景图像。使用http://www.stripegenerator.com作为基本条纹背景，然后使用您选择的图像编辑器创建淡入淡出。

Answer 2

这可能会让你开始朝着正确的方向前进。这可能但很乏味：

DEMO

您可以轻松交换颜色。但是，我无法获得对角线的不透明度渐变。

请参阅here以构建行的CSS。