首页后端开发其他后端知识修改CSS样式实现网页变灰色/黑白代码的几个方法整理

修改CSS样式实现网页变灰色/黑白代码的几个方法整理

时间2023-04-20 01:54:01发布访客分类其他后端知识浏览788
导读:今天上午有网友提到希望将网站整体的色调换成灰色、黑色色调,这个记得在以前纪念一些日子的时候会有用到,早年老蒋在自己的博客中也有使用的。记得那时候直接是修改CSS就可以实现,既然有用户需要,老蒋这里抽点时间再整理一下看看是否有其他更好的方法。...

今天上午有网友提到希望将网站整体的色调换成灰色、黑色色调,这个记得在以前纪念一些日子的时候会有用到,早年老蒋在自己的博客中也有使用的。记得那时候直接是修改CSS就可以实现,既然有用户需要,老蒋这里抽点时间再整理一下看看是否有其他更好的方法。

我们可以根据实际的需要选择合适的CSS代码样式添加到自己的网页模板的代码中实现网页灰色、黑白样式。

第一、网页黑白代码样式A

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>

这里我们可以将代码添加到HEAD模板中,要实现全站才可以。

第二、网页黑白代码样式B

html {
filter: progid:DXImageTransform.Microsoft.BasicImage(grayscale=1);
-webkit-filter: grayscale(100%);
}

同样的可以添加到样式中。

第三、网页黑白代码样式C

html style="filter: progid:DXImageTransform.Microsoft.BasicImage(grayscale=1);
-webkit-filter: grayscale(100%); ">

这个直接是修改HEAD区域顶部HTML的,这个好像比较简单。

这里,我们根据实际的需要选择添加到代码中。

声明:本文内容由网友自发贡献,本站不承担相应法律责任。对本内容有异议或投诉,请联系2913721942#qq.com核实处理,我们将尽快回复您,谢谢合作!

网页变灰代码网页改黑白色教程网页设置成黑白色网页黑白显示

若转载请注明出处: 修改CSS样式实现网页变灰色/黑白代码的几个方法整理
本文地址: https://pptw.com/jishu/3938.html
轻松实现PHP随机图片展示功能代码整理 WordPress 5.9.3 维护版本发布 下一个将是WordPress 6.0版本

游客 回复需填写必要信息