首页 > 教程 > 网页特效源码 > 网页css

    收藏

    在纪念日等特殊情况下网站变灰,变黑白的css解决方案
    2022-11-30网页css177℃
    广告
    核心提示:可以使用以下几种方法,在公共css文件中加入以下代码即可html {-webkit-filter: grayscale(100%);filter:progid:DXImageTransform.Microsoft.BasicImage(graysale=1);}或者使用html { -webkit-filter: grayscale(100%); -moz-filter: grayscale(100%); -ms-filter: grayscale(100%); -o-filter: grayscale(
    可以使用以下几种方法,在公共css文件中加入以下代码即可
    html {
      -webkit-filter: grayscale(100%);filter:progid:DXImageTransform.Microsoft.BasicImage(graysale=1);
    }

    或者使用
    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; 
    }

    直接在html页面中,就用下面这个
    <style> 
        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; 
        } 
    </style>

    如果只想让图片黑白化,可以用到CSS的滤镜属性
    img {
        -webkit-filter: grayscale(100%); 
        filter: grayscale(100%);
    }

    局部变色可以这样写
    <style type="text/css">
    .maskhui {
      -webkit-filter: grayscale(100%);filter:progid:DXImageTransform.Microsoft.BasicImage(graysale=1);
    }
    </style>
    <div class="maskhui">
    需要变色的内容部分
    </div>

 
  • 文本链接:https://mbtxw.com/Course/show.php?itemid=133
  • 文章来源:模板模板
  • 版权声明:除非特别标注,否则均为本站原创文章,转载时请以链接形式注明文章出处。
0相关评论