zoukankan      html  css  js  c++  java
  • CSS grayscale滤镜+SVG使图片变黑白实例页面

    http:/CSS 地址:/www.runoob.com/cssref/css3-pr-filter.html

    
    
    CSS代码:
    .gray { 
        -webkit-filter: grayscale(100%);
        -moz-filter: grayscale(100%);
        -ms-filter: grayscale(100%);
        -o-filter: grayscale(100%);
        filter: grayscale(100%);
        filter: url(gray.svg#grayscale);
        
        filter: gray;
    }
    HTML代码:
    <img src="//image.zhangxinxu.com/image/study/s/s256/mm1.jpg" />
    <img src="//image.zhangxinxu.com/image/study/s/s256/mm1.jpg" class="gray" />
    SVG代码:
    <svg version="1.1" xmlns="http://www.w3.org/2000/svg">
        <filter id="grayscale">
            <feColorMatrix type="matrix" values="0.3333 0.3333 0.3333 0 0 0.3333 0.3333 0.3333 0 0 0.3333 0.3333 0.3333 0 0 0 0 0 1 0"/>
        </filter>
    </svg>
  • 相关阅读:
    Eclipse中的快捷键
    Eclipse配置
    Java语言概述
    视口及媒体查询
    弹性盒flex
    less——css预处理语言
    过渡/动画/变形
    列表/表格/表单
    渐变
    背景background
  • 原文地址:https://www.cnblogs.com/na-w/p/9401563.html
Copyright © 2011-2022 走看看