如何在css中制作颜色图案？ [关闭]答案

【问题标题】：How to make color patterns in css? [closed]如何在css中制作颜色图案？ [关闭]
【发布时间】：2017-08-28 20:07:56
【问题描述】：

为了实现这个设计，我创建了一个特定大小的 div。在上面的图像中，div 的背景颜色是红色，绿色以某种模式在其顶部用作烟雾。我怎样才能创建这样的模式？在 CSS 中实现此目的有哪些不同的方法？

<div id="canvas" style="background-color:red;">

</div>

这是我能做的。我在 Photoshop 上创建了一个相似的颜色图案（绿色图案）。把它放在这个 div 上，然后尝试改变那个图案的颜色。但它并没有反映出任何变化。

【问题讨论】：

css-tricks.com/stripes-css
如果您使用透明背景保存 Photoshop 文件，您可以在 CSS 中使用多个背景。 w3schools.com/css/css3_backgrounds.asp
您需要想出的不仅仅是div。研究canvas如何工作并努力，所以我们知道你知道一些事情，否则这将毫无意义
@MathijsFlietstra 考虑到这个用户已经存在了 3 年，他们应该知道最好不要让别人做他们的工作。顺便说一句，我没有投反对票，正如你所见，我发表评论并投票结束。
@LGSon，我确实认为这种方法包括一些关于用户以前使用该网站的假设，并且怀疑 4 人设法在用户发布问题的一分钟内得到一个很好的概述。 . 顺便说一句，我不是在评论否决票的有效性，只是在他们似乎出现的方式上..

标签： html css

【解决方案1】：

您可以在 SVG ( Illustrator ) 中制作这种颜色图案，然后您可以像这样在您的项目中使用它

 <div class="mySvg">
   <svg>
     <use x="0" y="0" xlink:href="#color"></use>
   </svg>
 </div>

【讨论】：