居然可以这样internet选项打不开(internet选项灰色打不开)
以下给出本人编写的一个简单Demo进行变灰测试，原始页面效果如下：测试原始页面按照编码要求，我们在该页面头部<head>编写样式文件
.jpg)
灰色显示百度首页今天早上醒来一看各大网站，为表示新冠肺炎疫情死难者的哀悼，各大网站均将页面变为灰色显示，显示的极为庄重肃穆本文主要介绍常用网页页面快速变灰色的方法CSS样式Filter属性对于网页而言，页面色彩、布局等主要受到层叠样式文件CSS控制，网站页面整体色彩的改变可以通过CSS进行整体的控制。
在CSS中可以通过filter滤镜属性实现对网页元素进行图像、背景及素材的渲染
Filter调整测试Demo如上图所示，通过设置Filter的属性取值，实现对颜色色彩的控制主要属性说明如下：1、filter: blur()方法该方法主要用于实现对图像设置高斯模块，及屏幕上的像素融合程度即模糊程度。
其参数需要以像素值形式进行提供参数值越大模糊程度越高示例如下图：
网页中显示的今日头条图标在未使用filter属性未设置时，今日头条显示的原始图片效果如上图所示我们可以进一步对页面添加style样式调整filter blur参数值，可实现页面的模糊程度如blur参数取值为2个像素，效果如下：。
blur参数取值为2显示效果2、filter: grayscale()方法该方法是用于实现页面变灰的主要方法，主要用于设置页面显示的灰度参数值需要以百分比形式进行提供，0%表示未进行灰度调整，100%表示将页面完全转化为灰度。
我们还是以今日头条图标为例，对其进行灰度设置进行说明当灰度取值设置为20%时效果如下图1所示，当灰度值设置为100%时效果如图2所示：
图一：灰度20%设置显示效果
图二：灰度100%设置图片显示效果使用filter提供的 grayscale()方法对页面进行灰度设置实现效果描述如上图，我们可以快速实现将页面快速变灰目前浏览器的内核型号较多，对CSS的支持与解析情况不相同，在进行页面灰度处理时需要考虑到用户终端浏览器的类型，需要进行CSS样式的兼容性设置。
实现基本代码描述如下：-webkit-filter: grayscale(100%); //(Apple Safari内核) -moz-filter: grayscale(100%); //(Firefox浏览器)
-ms-filter: grayscale(100%); //(Internet Explorer（IE）浏览器) -o-filter: grayscale(100%); //(Opera浏览器)
网页变灰实例在明确网页变灰所需使用滤镜效果之后，我们可以使用其属性进行页面变灰效果。以下给出本人编写的一个简单Demo进行变灰测试，原始页面效果如下：
测试原始页面按照编码要求，我们在该页面头部编写样式文件，实现变灰处理，所添加代码描述如下：
变灰实现代码在页面添加变灰代码之后，我们可以看出明显的变灰效果，效果描述如下：
页面变灰实现效果本文给出了网页页面变灰的实现简单方法，作为网页设计人员、前端开发人员应当能够掌握基本使用方法，实现页面的快速改变。
- 标签：
- 编辑：李松一
- 相关文章
-
这样也行？明天吃什么(明天吃什么家常菜)
苦瓜酿肉
-
这样也行？明天吃什么(明天吃什么家常菜)
#秋日生活打卡季#大家好！欢迎收看我的美食自媒体，我是锦绣V山东，一个专注于美食创作的创作者。我的口号是“专注美食，让生活更美味”，…
- 不看后悔泡泡堂辅助(泡泡堂神威辅助有什么用啊)
- 深度揭秘全国最火的早餐加盟店(适合女人一个卖早餐摆摊)
- 学到了吗全国最火的早餐加盟店(适合女人一个卖早餐摆摊)
- 快来看比思社区(51nb论坛)
- 干货分享刺客技能(dota2幻影刺客技能)
