Object
、embed
标签引入html
<div class="item">
<object data="test.svg" type="image/svg+xml"></object>
<embed src="test.svg" type="image/svg+xml" />
</div>
更改颜色,大小可通过css
处理
.item {
overflow: hidden;
object,embed {
cursor: pointer;
filter: drop-shadow(#000000 0px -100px);
transform: translate(0px, 100px);
}
}
PS:采用投影的方式将其改变色值, drop-shadow,须将父元素设置为
overflow: hidden;
即可!
CSS mask
引入html
<div class="item"></div>
css
.item{
mask: url("/test.svg") no-repeat center center;
mask-size: contain;
cursor: pointer;
background-color: rgba(0, 0, 0, 0.9);
}
iconfont
引入 iconfont