明天4月4日会举行全国性哀悼活动,小伙伴需要将彩色网页都变成黑白的,代码如下:

<style type="text/css">html {-webkit-filter: grayscale(100%);}</style>

上面的 CSS 代码可能只对主流浏览器支持,如果你需要支持 QQ 浏览器、360 浏览器、IE 浏览器等等其他浏览器需要使用下面这段:

<style> 
    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; 
    } 
</style>

filter 是滤镜的意思,filter:gray 的意思就是说给页面加上一个灰度的滤镜,所以 html 里面的所有内容都会变成黑白的了。不过这个滤镜对于 chrome 和 safari 浏览器是无效的,所以下面会有一行-webkit-filter: grayscale(100%);这个样式是专属于使用 webkit 内核的浏览器的,意思和 FILTER: gray;差不多,只是写法不同罢了。

相关文章:

  • 2022-12-23
  • 2021-07-26
  • 2022-12-23
  • 2021-12-07
  • 2022-02-10
  • 2021-07-16
猜你喜欢
  • 2021-10-19
  • 2021-11-18
  • 2021-12-18
  • 2022-01-28
  • 2022-12-23
  • 2021-06-03
  • 2022-12-23
相关资源
相似解决方案