CSS 网页变灰效果
CSS HTML About 602 words滤镜函数
设置在html
节点,则应用于全局。
html {
-webkit-filter: grayscale(100%);
-moz-filter: grayscale(100%);
-ms-filter: grayscale(100%);
-o-filter: grayscale(100%);
filter: grayscale(100%);
filter: progid:DXImageTransform.Microsoft.BasicImage(grayscale=1);
}
复合函数
组合任意数量的函数来控制渲染。
filter: contrast(175%) brightness(3%)
兼容性
除IE
外,其他的PC
、手机端的浏览器都支持,Firefox
的 PC、安卓端还单独对SVG
图像加了支持。
filter参数
url
:设置一个SVG
滤镜blur
:高斯模糊brightness
:给图片应用一种线性乘法,使其看起来更亮或更暗contrast
:调整图像的对比度drop-shadow
:给图像设置一个阴影效果opacity
:转化图像的透明程度sepia
:将图像转换为深褐色grayscale
:灰色图像
参考
Views: 2,458 · Posted: 2020-04-06
————        END        ————
Give me a Star, Thanks:)
https://github.com/fendoudebb/LiteNote扫描下方二维码关注公众号和小程序↓↓↓
Loading...