首页 » SEO优化 » php灰色技巧_网站实现吊唁变灰效果一行css样式代码搞定

php灰色技巧_网站实现吊唁变灰效果一行css样式代码搞定

访客 2024-11-20 0

扫一扫用手机浏览

文章目录 [+]

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

修正源码

其余紧张方便快捷的方法是利用CSS样式的grayscale()方法。

php灰色技巧_网站实现吊唁变灰效果一行css样式代码搞定

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

php灰色技巧_网站实现吊唁变灰效果一行css样式代码搞定
(图片来自网络侵删)

最大略地把页面的<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即可

相关文章

今日头条算法岗三面算法工程师的面试之路

大数据和人工智能技术逐渐成为各行各业的热门话题。今日头条作为中国领先的资讯平台,其算法岗位一直是求职者争相竞逐的焦点。本文将针对今...

SEO优化 2025-01-31 阅读1 评论0

今日头条算法如何打造个化内容推荐

在移动互联网时代,信息爆炸已成为常态。如何在海量信息中找到自己感兴趣的内容,成为了一个亟待解决的问题。今日头条作为一款备受瞩目的新...

SEO优化 2025-01-31 阅读1 评论0

今日头条算法推荐其弊端与反思

算法推荐已经成为各大平台的核心竞争力。今日头条作为国内领先的资讯平台,凭借其强大的算法推荐系统,吸引了大量用户。在享受算法带来的便...

SEO优化 2025-01-31 阅读1 评论0

今日头条算法思维导图信息推荐的奥秘

信息传播速度越来越快,用户对信息的需求也越来越多样化。今日头条作为一款备受关注的新闻资讯平台,其背后的算法推荐机制一直是业界关注的...

SEO优化 2025-01-31 阅读1 评论0