哀悼日网站全站变灰代码，最简单的还是ng这种方式...-低调大师

哀悼日网站全站变灰代码，最简单的还是ng这种方式...

2020-04-06 638

云栖号资讯：【点击查看更多行业资讯】
在这里您可以找到不同行业的第一手的上云资讯，还在等什么，快来！

一般在清明节，全国哀悼日，大地震的日子，以及一些影响力很大的伟人逝世或纪念日的时候，身为站长的我们都会让自己的网站的全部网页变成灰色（黑白色），以表示我们对逝者的悼念。

那么今天就说说，通过几行简单的代码，来实现这个功能。

第一种：修改CSS文件

我们可以在网页的CSS文件中添加以下的CSS代码，来实现网页黑白色，也就是网站变灰。

代码

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

第二种：在网页的标签内加入以下代码

如果你不想改动CSS文件，你可以通过在网页头部中的

标签内部加入内联CSS代码的形式实现网站网页变灰。

代码

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

第三种：修改标签加入内联样式

如里上面的两种方式都不喜欢，可以通过修改标签，以加入内联样式的方法，达到网页变灰的效果

代码

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

第四种：作者本人用的CSS代码

代码：

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

第五中：通过nginx使网站变灰

在Nginx负载均衡服务器上，利用sub_filter指令在输出的HTML中增加一行。

就可以实现在IE及IE内核浏览器下，所有网站变灰色。步骤如下：

1、重新编译Nginx，增加http_sub_module模块：

--with-http_sub_module

2、在nginx.conf配置文件的http {...}大括号内增加以下两行：

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

3、保存后，重新加载配置文件：

/usr/local/nginx/sbin/nginx -t
/usr/local/nginx/sbin/nginx -s reload

这样，整个页面就都变灰色了。

PS：以上几种方法，都是通过CSS的滤镜来控制页面的显示而已，唯一不同的就CSS代码调用的方式。各位，喜欢哪种就自己挖去吧！

【云栖号在线课堂】每天都有产品技术专家分享！
课程地址：https://yqh.aliyun.com/zhibo

立即加入社群，与专家面对面，及时了解课程最新动态！
【云栖号在线课堂社群】https://c.tb.cn/F3.Z8gvnK

原文发布时间：2020-04-07
本文作者：互联网架构师
本文来自：“互联网架构师微信公众号”，了解相关信息可以关注“互联网架构师”

微信关注我们

原文链接：https://yq.aliyun.com/articles/753697

转载内容版权归作者及来源网站所有！

低调大师中文资讯倾力打造互联网数据资讯、行业资源、电子商务、移动互联网、网络营销平台。持续更新报道IT业界、互联网、市场资讯、驱动更新,是最及时权威的产业资讯及硬件资讯报道平台。

从零搭建一个SpringCloud项目之Feign搭建

从零搭建一个SpringCloud项目之Feign搭建工程简述目的：实现trade服务通过feign调用user服务的功能。因为trade服务会用到user里的一些类和接口，所以抽出了其他服务需要的东西到user-api工程。避免trade直接依赖user导致依赖多余的东西。一、创建User接口工程user-api新建一个module，取名为study-user-api引入pom文件 <dependency> <groupId>org.springframework.cloud</groupId> <artifactId>spring-cloud-starter-openfeign</artifactId> </dependency> </dependencies> 创建一个User实体类编写一个UserApi接口，value里的study-user对应后面user实现工程的spring.application.name的值@FeignClient(value = "study-user")pub...

2020-04-05

544

云栖号在线课堂，及时了解行业动态！阿里云推出疫情专题方案，为企业业务护航，让你足不出户了解行业动态。在这里可以走近阿里云基础产品，了解更多应用方案，还能遇见大咖分享洞见及故事！也可以通过视频的形式让你高效、生动的了解场景化的上云最佳实践。本周重磅推荐标题：罗汉堂秘书长讲述：疫情下的全球经济简介：新冠疫情已经蔓延至全球。继中国付出沉痛代价以后，欧美成为新的重灾区，很多国家在佛系抗疫和经济停摆之间摇摆，美国股市十天经历了史无前例的四次熔断。疫情会把世界带往何方？过载的各类判断和信息充斥在巨大的不定性和焦虑之中。此次分享围绕疫情、经济、全球三个关键词，从宏观经济的角度，探讨疫情的持续性、蔓延势头以及对全球经济、金融格局和供应链等影响。观看直播标题：从数字化到数智化：盒马新零售操作系统的建设简介：企业面对数字化转型，线上线下一体化的背景下，做为CIO 和产研团队，我们所要面对的主要挑战是什么？如何重新定位自身的角色？我们会有什么机会呢？大少做为新零售领军企业盒马的产研负责人，他是如何思考的，又有什么最佳实践呢。观看直播标题：阿里云新品发布会第88期：分析型数据库Analyt...

2020-04-07

682

资源下载

更多资源

腾讯云软件源

为解决软件依赖安装时官方源访问速度慢的问题，腾讯云为一些软件搭建了缓存服务。您可以通过使用腾讯云软件源站来提升依赖包的安装速度。为了方便用户自由搭建服务架构，目前腾讯云软件源站支持公网访问和内网访问。

Spring

Spring框架（Spring Framework）是由Rod Johnson于2002年提出的开源Java企业级应用框架，旨在通过使用JavaBean替代传统EJB实现方式降低企业级编程开发的复杂性。该框架基于简单性、可测试性和松耦合性设计理念，提供核心容器、应用上下文、数据访问集成等模块，支持整合Hibernate、Struts等第三方框架，其适用范围不仅限于服务器端开发，绝大多数Java应用均可从中受益。

Rocky Linux

Rocky Linux（中文名：洛基）是由Gregory Kurtzer于2020年12月发起的企业级Linux发行版，作为CentOS稳定版停止维护后与RHEL（Red Hat Enterprise Linux）完全兼容的开源替代方案，由社区拥有并管理，支持x86_64、aarch64等架构。其通过重新编译RHEL源代码提供长期稳定性，采用模块化包装和SELinux安全架构，默认包含GNOME桌面环境及XFS文件系统，支持十年生命周期更新。

Sublime Text

Sublime Text具有漂亮的用户界面和强大的功能，例如代码缩略图，Python的插件，代码段等。还可自定义键绑定，菜单和工具栏。Sublime Text 的主要功能包括：拼写检查，书签，完整的 Python API ， Goto 功能，即时项目切换，多选择，多窗口等等。Sublime Text 是一个跨平台的编辑器，同时支持Windows、Linux、Mac OS X等操作系统。