在CSS中创建背景图案 [英] Create a background pattern in CSS

问题描述

我有以下图片

其中有一个有角度的条纹图案，我想知道如何使用CSS作为背景图案创建这个图案。

which has this angled stripe pattern in it, I was wondering how I could create this pattern with CSS as a background pattern.

干杯，
es

cheers, es

推荐答案

（编辑：我在代码中添加了第二个示例）

(edit: I added a second example in the codepen)

到已经给出的答案，但是除了避免渐变：

Similar to an already given answer, but with an addition to avoid gradients:

http://codepen.io/anon/pen/EyNwOq

给它一个重现线性渐变背景，但为了避免渐变和只需要得到两个单独的颜色，做到如下（使用设置来获得条纹宽度和你喜欢的颜色）：

Give it a repating linear gradient background, but to avoid the gradients and to only get two separate colors, do it as follows (play around with the settings to get the stripe width and colors you like):

background: repeating-linear-gradient( -45deg, #000 0px, #000 5px, #333 6px, #333 11px, #000 12px);

这篇关于在CSS中创建背景图案的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！