美文网首页
如何把整个网页都变成黑白

如何把整个网页都变成黑白

作者: 我有一条小黑狗 | 来源:发表于2022-12-01 09:12 被阅读0次

    利用CSS的 filter: grayscale(1)

    使用 filter 属性对元素应用滤镜效果的方法,匹配 SVG 中可用的滤镜。 滤镜功能包括模糊blur、亮度brightness、对比度contrast、阴影drop-shadow、灰度grayscale、色调旋转hue-rotate、反转invert、不透明度opacity、棕褐色sepia和饱和度saturate。

    例如,对图片进行灰度化处理:

    img {

      -webkit-filter: grayscale(100%);

      -moz-filter: grayscale(100%);

      -ms-filter: grayscale(100%);

      -o-filter: grayscale(100%);

      filter: grayscale(100%);

      filter: gray;

    }

    把整个网页都变成黑白:

    把上边提到的脚本,在网页中对body元素生效即可。

    body {

      -webkit-filter: grayscale(100%);

      -moz-filter: grayscale(100%);

      -ms-filter: grayscale(100%);

      -o-filter: grayscale(100%);

      filter: grayscale(100%);

      filter: gray;

    }

    相关文章

      网友评论

          本文标题:如何把整个网页都变成黑白

          本文链接:https://www.haomeiwen.com/subject/nfwjfdtx.html