是否可以使用任何网络语言将纹理蒙版放在图像上？

Question

我想为门创建一个简单的网上商店，我想要有自定义门用户可以改变颜色或纹理的功能。但我想象的唯一方法是为所有纹理和所有颜色的所有门创建单个.jpg文件，并进行更改。是否有任何图书馆或任何方式我可以在网上进行掩蔽和纹理化？门是这样的：

并且纹理如下：

我已经创建了separete基本门，因此如果用户正在更改门类型，则只有上面的图层会出现特殊的样式和玻璃。但我无法创造纹理造型和纹理门。

Answer 1

你可以做这样的事情使用img并添加不透明度并为div设置背景纹理

演示 - http://jsfiddle.net/wyLtq6hz/

div {
  display: inline-block;
  background: url(http://i.stack.imgur.com/RnQMf.jpg);
}
div img {
  opacity: .8;
  vertical-align: middle;
}

<div>
  <img src="http://i.stack.imgur.com/glt6A.jpg" />
</div>

Answer 2

您可以使用HTML5画布进行图像处理。有几个图书馆可以帮助你。 Here is a tutorial from MSDN。 SVG也可以做到这一点。 Read this question from Stackoverflow.也许这是一种更好的方法。希望这会对你有所帮助。