img{
filter: opacity(25%); /* 透明度 */
filter: grayscale(50%); /* 灰度 */
filter: invert(1); /* 反色 */
filter: brightness(0.4); /* 亮度 */
filter: saturate(300%); /* 饱和度 */
filter: sepia(60%); /* 褐色 */
filter: blur(2px); /* 模糊 */
filter: hue-rotate(90deg); /* 色相翻转 */
filter: contrast(2); /* 对比度 */
filter: drop-shadow(5px 5px 5px #aaa); /* 阴影 */
}
-webkit-filter: blur(10px) brightness(80%) opacity(0.8);
filter: blur(10px) brightness(80%) opacity(0.8);
依次的滤镜效果分别是透明度、灰度、反色、亮度、饱和度、褐色、模糊(本人最喜欢的一种滤镜)、色相翻转、对比度、阴影
类似于PS里面的滤镜,当然没有PS里面的滤镜多
PS:可以使用hover观察效果
版权声明:本文为u011146423原创文章,遵循 CC 4.0 BY-SA 版权协议,转载请附上原文出处链接和本声明。