无障碍 无障碍阅读 开始适老模式

智网科技在挑战中诞生

迎难不惧,逆风前行,挑战成为我们的习惯

当前位置:首页>帮助中心>网站知识
全部 131 网站知识 44 400电话 68 VR知识 5 微信服务 8 ICT文档 6

快速实现网站变灰,可整个网站变灰也可以指定某个页面变灰的CSS样式源代码

时间:2022-11-30   访问量:87

网站变灰的方法比较多,根据自己的网站结构,调用模式不同,实现的方法也不完全相同。但原理上基本都差不多,基本上都是通过CSS样式表进行控制。


如果是某个页面变灰,就把变灰的CSS代码放在当前页面,也可以放在统一的CSS文件内进行调用。


CSS代码如下,直接放到你的*.CSS文件里即可:

html.grey img{

-webkit-filter: grayscale(100%);

-moz-filter: grayscale(100%);

-ms-filter: grayscale(100%);

-o-filter: grayscale(100%);

filter: grayscale(100%);

filter: gray;

}

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


然后在变灰的页面进行调用

<html class="grey">


如果CSS代码放在变灰的页面里,则需要粘贴到 <head></head> 之间

具体如下:

<head>

...这里是你其他的代码

<style type="text/css">

/*站点变灰*/

html.grey img{

-webkit-filter: grayscale(100%);

-moz-filter: grayscale(100%);

-ms-filter: grayscale(100%);

-o-filter: grayscale(100%);

filter: grayscale(100%);

filter: gray;

}

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

</style>

</head>


上一篇:为什么服务器会屡遭入侵,如何才能提高服务器和网站安全

下一篇:浅谈政府网站运维当中发送运维邮件的重要性