网站页面变灰色的效果

最新推荐文章于 2022-12-02 12:41:56 发布

janthinasnail

最新推荐文章于 2022-12-02 12:41:56 发布

阅读量389

点赞数

分类专栏： css

本文链接：https://blog.csdn.net/janthinasnail/article/details/105310569

版权

css 专栏收录该内容

4 篇文章 0 订阅

订阅专栏

注：以下代码源自原网站css代码

/*csdn网站变灰色的效果，代码如下*/
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);
}

/*百度logo图片变灰色的效果，代码如下*/
#result_logo.qm-activity {
    filter: progid:DXImageTransform.Microsoft.BasicImage(grayscale=1);
    -webkit-filter: grayscale(100%);
    -moz-filter: grayscale(100%);
    -ms-filter: grayscale(100%);
    -o-filter: grayscale(100%);
    filter: grayscale(100%);
    filter: gray;
}

/*腾讯网站变灰色效果，放在body中，代码如下，*/
.garyBody {
    filter: grayscale(100%);
    -webkit-filter: grayscale(100%);
    -moz-filter: grayscale(100%);
    -ms-filter: grayscale(100%);
    -o-filter: grayscale(100%);
    -webkit-filter: grayscale(1);
}

/*淘宝网首页变灰色，代码如下*/
html {
    -webkit-filter: grayscale(100%);
    filter: progid:DXImageTransform.Microsoft.BasicImage(grayscale=1);
}

/*京东商城首页变灰色，代码如下*/
html.o2_gray {
    -webkit-filter: grayscale(100%);
    filter: progid:DXImageTransform.Microsoft.BasicImage(grayscale=1);
}

/*网易首页变灰色，代码如下*/
html {
    -webkit-filter: grayscale(100%);
    -moz-filter: grayscale(100%);
    -ms-filter: grayscale(100%);
    -o-filter: grayscale(100%);
    filter: progid:DXImageTransform.Microsoft.BasicImage(grayscale=1);
    _filter: none;
}

参考：https://blog.csdn.net/bigbear00007/article/details/101641038