html中调整颜色的图标,在CSS中设置SVG图标颜色

CSS

语言：

CSSSCSS

确定

.icon {

display: inline-block;

width: 50px;

height: 50px;

background: url("data:image/svg+xml;utf8,%3Csvg%20version%3D%221.1%22%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20xmlns%3Axlink%3D%22http%3A%2F%2Fwww.w3.org%2F1999%2Fxlink%22%20x%3D%220px%22%20y%3D%220px%22\a%20%20%20viewBox%3D%220%200%2030%2030%22%20enable-background%3D%22new%200%200%2030%2030%22%20xml%3Aspace%3D%22preserve%22%3E\a%3Cpath%20fill%3D%22%23F84830%22%20d%3D%22M18.7%2C10.1c-0.6%2C0.7-1%2C1.6-0.9%2C2.6c0%2C0.7-0.6%2C0.8-0.9%2C0.3c-1.1-2.1-0.4-5.1%2C0.7-7.2c0.2-0.4%2C0-0.8-0.5-0.7\a%20%20c-5.8%2C0.8-9%2C6.4-6.4%2C12c0.1%2C0.3-0.2%2C0.6-0.5%2C0.5c-0.6-0.3-1.1-0.7-1.6-1.3c-0.2-0.3-0.4-0.5-0.6-0.8c-0.2-0.4-0.7-0.3-0.8%2C0.3\a%20%20c-0.5%2C2.5%2C0.3%2C5.3%2C2.1%2C7.1c4.4%2C4.5%2C13.9%2C1.7%2C13.4-5.1c-0.2-2.9-3.2-4.2-3.3-7.1C19.6%2C10%2C19.1%2C9.6%2C18.7%2C10.1z%22%2F%3E\a%3C%2Fsvg%3E");

}

body {

text-align: center;

font-family: Merriweather;

font-size: 18px;

line-height: 1.7;

padding: 10vw;

background: #333;

color: #eee;

}