第一种：修改CSS文件

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

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

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

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

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

第四种：body

1
2
3
4
5
6
7
8
9
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 sub_filter

1
2
3
4
5
6
7
location / {
    root   /opt/app/code/;
    random_index on;
    index  index.html index.htm;
    sub_filter '<h1>Admin' '<h1>ggggg';  //第一个参数是要被替换的，第二个参数是替换后的
    sub_filter_once off;   //替换所有的，默认是on，替换第一个
}