-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. MySQL 创建自定义函数(2)

    说明:下面创建一个函数,调用自定义函数返回一个返回一个随机数. (1) 创建自定义函数

  2. 【BZOJ2427】[HAOI2010]软件安装 Tarjan+树形背包

    [BZOJ2427][HAOI2010]软件安装 Description 现在我们的手头有N个软件,对于一个软件i,它要占用Wi的磁盘空间,它的价值为Vi.我们希望从中选择一些软件安装到一台磁盘容量为 ...

  3. MongoDB在win7上的安装（精简版）

    1.下载mongdb的zip文件,解压后会发现有bin文件夹,在同层目录下建一个data目录, 2.在data目录下建一个log和db文件夹, 3.在log文件下建一个MongoDB.log 文件 4 ...

  4. HibernateTemplate方法的使用

    1.查询帖子(Post)为例 查找所有的帖子 public List<Post> findPosts() { String hql = "from Post p left joi ...

  5. input file 选择Excel

    说明:开发环境 vs2012 asp.net mvc4 c# ,使用file 选择Excel文件 传到后台 使用Aspose.Cells获取Excel sheet页的名称 1.HTML代码 <% ...

  6. 我的Java开发学习之旅------>Java经典排序算法之快速排序

    一.算法思想     快速排序是C.R.A.Hoare于1962年提出的一种划分交换排序.它采用了一种分治的策略,通常称其为分治法(Divide-and-ConquerMethod).(1) 分治法的 ...

  7. linux删除目录下所有文件，但是保留文件夹

    删除目录和子目录下所有rpm文件,但是保留文件夹,先cd到想要删除的目录 命令如下 find ./ -name "*.rpm" | xargs rm

  8. nginx负载均衡设置

    在nginx的配置文件[./conf/nginx.conf]中加入: upstream test.balance123.com { server 192.168.1.223:80; server 19 ...

  9. 现代JS中的流程控制：详解Callbacks 、Promises 、Async/Await

    JavaScript经常声称是_异步_.那是什么意思?它如何影响发展?近年来这种方法有何变化? 请思考以下代码: result1 = doSomething1(); result2 = doSomet ...

  10. 【ES6】更易于继承的类语法

    和其它面向对象编程语言一样,ES6 正式定义了 class 类以及 extend 继承语法糖,并且支持静态.派生.抽象.迭代.单例等,而且根据 ES6 的新特性衍生出很多有趣的用法. 一.类的基本定义 ...