当前位置:首页 > 实用技巧 >

html灰色颜色代码(html中所有颜色代码)

来源:原点资讯(www.yd166.com)时间:2023-11-11 05:35:13作者:YD166手机阅读>>

在发生重大哀悼事件时候,需要紧急将网站变灰以示哀悼,在此虫虫给大家总结了几种方法,通过简单修改一下站点样式即可实现。

html灰色颜色代码,html中所有颜色代码(1)

修改源码

另外主要方便快捷的方法是使用CSS样式的grayscale()方法。

grayscale() : 对图片进行灰度转换,grayscale是 <filter-function> 的子属性,当100%参数时候的效果如下:

html灰色颜色代码,html中所有颜色代码(2)

最简单地把页面的<html>开始标签中间之间加:

style="-webkit-filter: grayscale(100%);"

或者修改站点CSS样式

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

将上述代码添加加到CSS最顶端就可以实现。

为了兼容多种浏览器标准,可以增加一下样式:

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; }

如果网站后台无法定义CSS样式,这需要在站点模板页的head标签中间插入style标志位:

<style> html{-webkit-filter: grayscale(100%);} </style>

对于一些老的网站,为了支持该函数需要修改html标头,将其修改为最新标准标头才可以:对一些使用Flash(不在建议使用)的老站点,起颜色可能也不支持CSS滤镜变灰,则需要在可以在FLASH代码的<object …>和之间插入:

<param value="false" name="menu"/>

<param value="opaque" name="wmode"/>

nginx代理

对于一下没有办法修改源站代码的情况下,也可以在Nginx站点代理无服务器上,通过sub_filter指令来实现。

受限确保nginx支持http_sub_module模块,如果不支持需要重新编译安装Nginx,自爱安装时候添加build参数—with-http_sub_module

然后在Nginx的http模块增加如下代码:

sub_filter '</head>' '<style type="text/css">html{ -webkit-filter: grayscale(100%);filter:progid:DXImageTransform.Microsoft.BasicImage(grayscale=1);}</style>';sub_filter_once on;

然后nginx -t测试配置正常无误

nginx -s reload 重启nginx即可

,

栏目热文

html中设置灰色(html怎么显示黄色)

html中设置灰色(html怎么显示黄色)

背景让网页变为黑白配色,是个常见的诉求。而且往往是突如其来的诉求,是无法预知的。当发生这样的需求时,我们需要迅速完成变更...

2023-11-11 05:26:57查看全文 >>

html中灰色的代码(html淡灰色背景颜色代码)

html中灰色的代码(html淡灰色背景颜色代码)

问:整个网页变成灰色的代码是什么?答:使这个网页的颜色变成灰色的最简单的方法,就是在当前页面的css里面。添加下面的代码...

2023-11-11 04:59:42查看全文 >>

打动人心的情感故事(情感故事10条简短)

打动人心的情感故事(情感故事10条简短)

有人说,真正的爱情是包容,是牺牲,是患难与共,相濡以沫,是不离不弃。真正的爱情或许缘于一种心动,但一定会伴随着一种高于...

2023-11-11 05:22:38查看全文 >>

给心上人的情话短句(情话最暖心句子给情人)

给心上人的情话短句(情话最暖心句子给情人)

1.我想,我们的友情走到了尽头。那么,做我女朋友吧。2.我爱你,永远为期,死亡为界,这辈子从没想过要放弃你。3.你的过去...

2023-11-11 05:18:14查看全文 >>

一句话打动人心爱情图片(一句话挽留爱情图片大全)

一句话打动人心爱情图片(一句话挽留爱情图片大全)

如同天上降楷模,真是人间好榜样,这个创作者,正能量!欢迎大家关注、点赞、评论、转发、收藏,谢谢!在探索词的迷人魅力中,我...

2023-11-11 05:25:26查看全文 >>

html中把颜色设置成灰色(如何将html的背景设置为黑色)

html中把颜色设置成灰色(如何将html的背景设置为黑色)

在每一个特定或者特殊的日子里,几乎所有的网站都变成了灰色,那么这种效果是怎么实现的呢?今天就来简单的实现一下这样的效果。...

2023-11-11 04:56:35查看全文 >>

html颜色名(html中的各类的符号颜色)

html颜色名(html中的各类的符号颜色)

颜色名列表单击一个颜色名或者 16 进制值,就可以查看与不同文字颜色搭配的背景颜色。可以用在字体上,也可以用在背景色上,...

2023-11-11 05:19:19查看全文 >>

html灰色的代码(html蓝色代码怎么用)

html灰色的代码(html蓝色代码怎么用)

大家看到网站的内容都变成了灰色,包括按钮、图片等等。这时候我们可能会好奇这是怎么做到的呢?有人会以为所有的内容都统一换了...

2023-11-11 05:37:52查看全文 >>

怎么判断两个比是不是比例(怎么区分比和比例的关系与区别呢)

怎么判断两个比是不是比例(怎么区分比和比例的关系与区别呢)

⊙回忆旧知,谈话导入1.课件出示教材16页上面的情境图。师:五张不同的图片,哪两张图片像,哪两张图片不像?学生仔细观察,...

2023-11-11 04:54:12查看全文 >>

比与比例有什么联系与区别(比和比例的区别和关系是什么)

比与比例有什么联系与区别(比和比例的区别和关系是什么)

一.概念描述 现代数学:比,亦称单比,算术术语。比较两个同类量之间的一种倍数关系,称为这两个同类量的比。在单位相同时,两...

2023-11-11 05:34:33查看全文 >>

文档排行