css一些图片处理

img {
        /* contrast 调整对比度单位 %   默认100％ 50%时和brightness的0.5效果类似 */
        filter: contrast(500%);
        /* 马赛克属性 blur 单位 px 默认0 也适用于文本 */
        filter: blur(10px);
        /* 亮度属性 brightness 单位 数字  默认1 类似于遮罩效果 */
        filter: brightness(1);
        /* 灰度属性 brightness 单位 %  默认0 最大100%  效果类似黑白照 */
        filter: grayscale(100%);
        /* 阴影 也适用于文本阴影 */
        filter: drop-shadow(5px 5px 5px red);
        /* 反转图像 invert 也适用于文本 单位 %  默认0 最大100% 透明效果 */
        filter: invert(100%);
        /* 透明 opacity 也适用于文本 单位 %  默认100%  */
        filter: opacity(50%);
        /* 图像转为棕褐色 sepia 单位 %  默认0% 最大100% */
        filter: sepia(500%);
        /* 饱和度 saturate 单位 %  默认100%  0时效果类似黑白照 越大色彩越鲜艳 */
        filter: saturate(200%);
        /* 色相旋转 hue-rotate 单位deg 默认0deg 最大360deg */
        filter: hue-rotate(360deg);
}