css基础--滤镜filter

目录

filter属性定义

属性值

none

blur(px)

brightness(%)

contrast(%)

drop-shadow(h-shadow v-shadow blurspread color)

grayscale(%)

hue-rotate(deg)

invert(%)

opacity(%)

saturate(%)

sepia(%)

---

filter属性定义

        设置元素(常用于<img>)可视化效果

属性值

none

        默认值，无效果

blur(px)

        设置模糊效果。默认值0，数值越大图像模糊效果越强

filter: blur();

缺点：边缘也会模糊不清

解决方法： 给图像添加一个box，将超出范围隐藏

brightness(%)

        设置亮度。默认值1，可以使用百分比或者小数，值为0%(0)图像全黑，值为100%(1)图像无变化，超过100%(1)，图像更亮

filter: brightness