使整个网站页面变灰的方法

2021-11-06 16:47:17

193

在清时节或哀悼日时，很多的站长都会把自己的网站页面调成灰色，以示哀悼。

网页变灰的方法

方法一：修改网站的CSS文件

打开网站的CSS样式文件，加入以下的代码即可！

代码1：

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

代码2：

body *{
-webkit-filter: grayscale(); /* webkit */
-moz-filter: grayscale(); /*firefox*/
-ms-filter: grayscale(); /*ie9*/
-o-filter: grayscale(); /*opera*/
filter: grayscale();
filter:progid:DXImageTransform.Microsoft.BasicImage(grayscale=1); 
filter:gray; /*ie9- */
}

以上代码，选择基中的一个就可以！

方法二：在网页的<head>标签内加入代码

在网页的 <head></head> 标签之间加入以下CSS样式代码也可以实现网页变灰的效果！

<style type="text/css">
html {
filter: progid:DXImageTransform.Microsoft.BasicImage(grayscale=1);
-webkit-filter: grayscale();}
</style>

方法三：在 <html> 标签内加入CSS样式

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

上一篇：纯CSS代码实现对号与叉号的效果下一篇：使用typescript+vite+

网站建设

Js

使整个网站页面变灰的方法