css实现网站整体变灰颜色

2021-12-05 0 809

为了达到这个页面效果,我们需要使用一个css过滤属性:filter。

可以在一个 DOM 节点上设置样式变化属性,实现整个网页的灰色效果,也可以设置为全局效果,还可以在 html 节点上设置属性。

有时候我们可能需要把整个网站灰化,实现方法很简单。将以下代码添加到wordpress主题目录中的style.css文件中:

/* 网站变灰代码 */  
html{   filter: grayscale(100%); -webkit-filter: grayscale(100%);    -moz-filter: grayscale(100%);   -ms-filter: grayscale(100%);    -o-filter: grayscale(100%); filter: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg'><filter id='grayscale'><feColorMatrix type='matrix'values='0.3333 0.3333 0.3333 0 0 0.3333 0.3333 0.3333 0 0 0.3333
0.3333 0.3333 0 0 0 0 0 1 0'/></filter></svg>#grayscale"); filter:progid:DXImageTransform.Microsoft.BasicImage(grayscale=1);  -webkit-filter: grayscale(1);}

 

本文章已结束,如转载请注明:汇站网 » css 实现网站整体变灰颜色

收藏 (0)

微信支付 微信扫一扫

支付宝支付 支付宝扫一扫

打赏二维码
点赞 (0)

站长资源下载中心-找源码上汇站

常见问题
  • 如果付款后没有弹出下载页面,多刷新几下,有问题联系客服!
查看详情
  • 本站所有资源版权均属于原作者所有,这里所提供资源均只能用于参考学习用,请勿直接商用。若由于商用引起版权纠纷,一切责任均由使用者承担。
查看详情

相关文章

联系官方客服

为您解决烦忧 - 24小时在线 专业服务