CSS：只更改一种指定的颜色？

Question

我正在寻找这个问题的解决方案。我会有很多视频和图片。我必须改变颜色。但只有一部分的颜色。当你看车时：它总是相同的一张图片，但颜色会被CSS改变。所以我可以使用洋红色或青色等颜色，然后将它们更改为首选颜色。

这可能吗？

Answer 1

是的，你可以。您需要做的是更改汽车图像，使其没有任何颜色。您需要将阴影更改为透明的白色/黑色PNG图像。

外部空间需要是纯色，与网站背景相同，例如白色。

我找不到好的图像，所以我添加了一些额外的CSS。但我想你会明白如何实现它。

基本上您需要做的就是将图像放在包装中。根据需要更改这些包装的背景颜色。图像的（半）透明度将“为汽车着色”。

.icon {
  display: inline-block;
  margin-right: 1em;
  border-radius: 100%;
}
.icon img {
  max-width: 100px;
  display: block;
}
.red { background-color: red; }
.blue { background-color: blue; }
.yellow { background-color: yellow; }

<div class="icon red"><img src="http://freeflaticons.com/wp-content/uploads/2014/10/square-copy-1412171043g4k8n.png" /></div>
<div class="icon blue"><img src="http://freeflaticons.com/wp-content/uploads/2014/10/square-copy-1412171043g4k8n.png" /></div>
<div class="icon yellow"><img src="http://freeflaticons.com/wp-content/uploads/2014/10/square-copy-1412171043g4k8n.png" /></div>