-webkit-filter: grayscale(%);

-moz-filter: grayscale(%);

-ms-filter: grayscale(%);

-o-filter: grayscale(%);

filter: grayscale(%);

filter: gray;

给图片加上这个css样式即可

css使图片变成黑白效果的更多相关文章

  1. css 使图片水平垂直居中

    1.利用display:table-cell,具体代码如下: html代码如下: <div class="img_wrap"> <img src="wg ...

  2. 【javascript/css】Javascript+Css实现图片滑动浏览效果

    今天用js+css来做一个能够左右滑动的图片浏览效果. 首先写一个结构,包括需要浏览的两张图,以及能够点击来滑动图片的两个按钮. <!DOCTYPE html> <html> ...

  3. CSS grayscale滤镜+SVG使图片变黑白实例页面

    http:/CSS 地址:/www.runoob.com/cssref/css3-pr-filter.html CSS代码: .gray { -webkit-filter: grayscale(%); ...

  4. html+css使图片在页面中循环滚动

    我们先通过html创建一个div盒子的框架,方便后续以及实际使用中调整位置. <!DOCTYPE html> <html> <head> <meta char ...

  5. CSS使图片变灰

    为了悼念,各大网站都纷纷将自己的站点颜色调灰,就连图片也一样,到底如何实现的呢,请看下面的代码. 〈img src="http://hovertree.com/hvtimg/201512/f ...

  6. CSS3 grayscale滤镜+SVG使图片变黑白实例页面

    CSS代码: .gray { -webkit-filter: grayscale(100%); -moz-filter: grayscale(100%); -ms-filter: grayscale( ...

  7. 用CSS使图片上下左右都绝对居中于DIV

    <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/ ...

  8. css 使图片紧贴底部显示

    img{ display: table-cell; vertical-align: bottom; }

  9. 利用CSS的translate属性或利用CSS实现图片居中的效果

    <!doctype html> <html lang="en"> <head> <meta charset="UTF-8&quo ...

随机推荐

  1. CString 成员函数用法大全(转)

    CString( );例:CString csStr; CString( const CString& stringSrc );例:CString csStr("ABCDEF中文12 ...

  2. 转载 ---资深HR告诉你：我如何筛选简历与选择人员的

    资深HR告诉你:我如何筛选简历与选择人员的   有个公司HR看简历 先直接丢掉一半 理由是不要运气不好的应聘者. 当然这可能只是某些HR面对太多的简历产生了偷懒的情绪,但是不论是Manager,亦或是 ...

  3. jqPaginator-master | kkpager-master 这两个分页插件的使用方法

    首先:百度"分页插件" 就会 找到这条链接: url=X8P3UpOM-6ceSfjdngX0oh9cNmVwSDy94CxKqWIazhyZ7If4S8wgpPqyEGUhk2t ...

  4. Python中类方法、__new__方法和__init__方法解析

    在编程语言中创建一个类,有构造方法这样的一个术语.而在Python中,通常大家都认为__init__是构造方法,其实并不完全等同.在构建类中,有一个特殊的方法__new__,这个才能等同为构造方法. ...

  5. js中scrollLeft、scrollWidth、offsetTop等相关位置属性的理解（转）

    1.常见的事件位置属性 e.pageX——相对整个页面的坐标 注意:IE6.IE7.IE8无该属性 e.layerX——相对当前坐标系的border左上角开始的坐标 注意:在opera.IE6.IE7 ...

  6. EasyNVR如何实现跨域鉴权

    EasyNVR提供简单的登录鉴权,客户端通过用户名密码登录成功后,服务端返回认证token的cookie, 后续的接口访问, 服务端从cookie读取token进行校验. 但是, 在与客户系统集成时, ...

  7. python循环导入的解决方案

    解决循环import的方法主要有几种:   1.延迟导入(lazy import)   即把import语句写在方法或函数里面,将它的作用域限制在局部. 这种方法的缺点就是会有性能问题.     2. ...

  8. WordPress用户角色及其权限管理编辑插件：User Role Editor汉化版

    如果Wordpress默认的用户角色及权限不能满足您的需求,又觉得修改代码编辑用户权限太麻烦.那不妨试试User Role Editor,Wordpress用户角色及其权限管理编辑插件. User R ...

  9. PHP获取 当前页面名称、主机名、URL完整地址、URL参数、获取IP

    $URL['PHP_SELF'] = isset($_SERVER['PHP_SELF']) ? $_SERVER['PHP_SELF'] : (isset($_SERVER['SCRIPT_NAME ...

  10. 线程池ThreadPoolExcecutor介绍

    线程池ThreadPoolExecutor 使用Executors和ThreadPoolExecutor 并发新特性—Executor 框架与线程池