您的位置：首页 / 二流茬博客 / 修改CSS样式实现网页变灰色/黑白代码的几个方法整理

信息未审核或下架中，当前页面为预览效果，仅管理员可见

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

    顶 顶 热
    2023/10/27 14:21:09 发布8009 浏览0 回复0 点赞
jihepc
管理
VIP铁粉

帖子：513

精华：2

注册：2020/02/12 22:18:00

IP属地：未知

今天上午有网友提到希望将网站整体的色调换成灰色、黑色色调，这个记得在以前纪念一些日子的时候会有用到。记得那时候直接是修改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的，这个好像比较简单。

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


以下内容回复后可见
赏

已有0人打赏

赞

已有0人点赞

等0人赞


    超级管理 编辑 删除
    加载中...

    回复楼主

    该帖子已经关闭回复
    回复 承诺遵守文明发帖，国家相关法律法规

    楼主其他帖子

    新帖速递

    查看更多

    精华好贴

    查看更多

    超级管理

    发布新帖 帖子管理 返回顶部