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);
}