CSS3 filter滤镜

1.菜鸟教程

2.CssGaga – 哀悼日网站一键变灰


.blur {

     -webkit-filter:  blur(4px);
     filter:  blur(4px);
}

.brightness  {
     -webkit-filter:  brightness(0.30);
     filter:  brightness(0.30);
}

.contrast  {
     -webkit-filter:  contrast(180%);
     filter:  contrast(180%);
}

.grayscale  {
     -webkit-filter:  grayscale(100%);
     filter:  grayscale(100%);
}

.huerotate  {
     -webkit-filter:  hue-rotate(180deg);
     filter:  hue-rotate(180deg);
}

.invert  {
     -webkit-filter:  invert(100%);
     filter:  invert(100%);
}

.opacity  {
     -webkit-filter:  opacity(50%);
     filter:  opacity(50%);
}

.saturate  {
     -webkit-filter:  saturate(7);
     filter:  saturate(7);
}

.sepia  {
     -webkit-filter:  sepia(100%);
     filter:  sepia(100%);
}

.shadow  {
     -webkit-filter:  drop-shadow(8px 8px 10px green);
     filter:  drop-shadow(8px 8px 10px green);
}

猜你喜欢

转载自blog.csdn.net/qq_42624874/article/details/80949950