filter_drop shadow更改图片颜色

filter:drop-shadow的属性值以及更改图片颜色的原理

dropshadow相当于一个盒子的投影 我们可以通过改变投影的颜色变相改变图片的颜色,原理就是将图片本身移出盒子之外 再将图片的投影移回来

//属性值
filter: drop-shadow(x偏移, y偏移, 模糊大小, 色值);

代码部分

//html部分
<div class="img_box">
	<img />
</div>
//css样式
.img_box {
  width: 53px;
  height: 53px;
  overflow: hidden;
}
. img {
  width: 53px;
  height: 53px;
  filter: drop-shadow(#659274 0 53px);
  transform: translateY(-53px);
}