在网站加入友情链接的LOGO时,因为不同logo颜色的问题,和主题色调可能产生冲突,
我选择用CSS3滤镜让logo变黑白,hover时变回原本的彩色
CSS代码:
.gray {
-webkit-filter: grayscale(100%);
-moz-filter: grayscale(100%);
-ms-filter: grayscale(100%);
-o-filter: grayscale(100%); filter: grayscale(100%); filter: gray;
}

CSS3 grayscale滤镜图片变黑白实例页面的更多相关文章

  1. CSS3 grayscale滤镜图片变黑白

    1. 使整个页面的图片都变成灰色的,代码如下. html{     font-size: 100%;     -webkit-text-size-adjust: none;    -ms-text-s ...

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

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

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

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

  4. css3 图片变黑白 filter

    /*图片黑白*/ .img-gray { -webkit-filter: grayscale(100%); -moz-filter: grayscale(100%); -ms-filter: gray ...

  5. java 让图片变黑白

    import java.awt.Image;import java.awt.color.ColorSpace;import java.awt.image.BufferedImage;import ja ...

  6. CSS3动画@keyframes图片变大变小颜色变化

    在我做公司官网的时候也会帮着写一些游戏的静态页,今天产品要求为了突出一个按钮,他要有颜色的变化而且要变大变小,然后我就在网上搜了下呼吸灯和其他的案例,写了个小damo,看着还有些魔性嘞. html: ...

  7. CSS3实现鼠标移动到图片上图片变大

    CSS3实现鼠标移动到图片上图片变大(缓慢变大,有过渡效果,放大的过程是有动画过渡的,这个过渡的时间可以自定义 <!DOCTYPE html><html> <head&g ...

  8. [Android实例] app引导页(背景图片切换加各个页面动画效果)(申明:来源于网络)

    [Android实例] app引导页(背景图片切换加各个页面动画效果)(申明:来源于网络) 地址: http://www.eoeandroid.com/thread-918356-1-1.html h ...

  9. CSS让图标变成白色或黑色实例页面 和css变灰色

    css代码 .black { filter: brightness(0); } .white { filter: brightness(100); } html代码 <h4>原图</ ...

随机推荐

  1. C语言的本质(3)——整数的本质与运算

    C语言的本质(3)--整数的本质与运算 计算机存储的最小单位是字节(Byte),一个字节通常是8个bit.C语言规定char型占一个字节的存储空间.如果这8个bit按无符号整数来解释,则取值范围是0~ ...

  2. mysql-bin.000001文件的来源及处理方法

    用ports安装了mysql以后,过一段时间发现/var空间不足了,查一下,会发现是mysql-bin.000001.mysql-bin.000002等文件占用了空间,那么这些文件是干吗的?这是数据库 ...

  3. eclipse中的两种Jre 及 Jre与Jdk的区别

    分类: ——————————区分eclipse中的两种Jre———————- (Eclipse也是一个普通的Java程序,因此必须有一个JRE做为运行环境.如果你的机器上没有安装任何JRE(或者JDK ...

  4. 【玩转Ubuntu】01. Ubuntu上配置JDK

    一.安装JDK 提示:这里我们使用jdk1.6,因为android开发要求使用1.6.如果不信你可以打开android studio,它会提示你选择JDK6的路径 下载地址: http://www.o ...

  5. uva 103 Stacking Boxes(DAG)

    题目连接:103 - Stacking Boxes 题目大意:有n个w维立体, 输出立体互相嵌套的层数的最大值, 并输出嵌套方式, 可嵌套的要求是外层立体的w条边可以分别对应大于内层立体. 解题思路: ...

  6. SQL整理4

    --====================简单增删改===========--查看学生表的全部数据select * from studio   --插入一个新的学生信息insert into stu ...

  7. 排序算法 -- 数据结构与算法的javascript描述 第12章

    排序是常见的功能,给定一组数据,对其进行排序. 在此之前,我们需要准备个基础工作--自动生成数组,并可以对该组数据做任何处理. /** * 测试类 ,数组 * @param numElements * ...

  8. memcached在注册表的位置

    HKEY_LOCAL_MACHINE-System-ControlSet001-services-Memcached Server

  9. .net通用权限框架B/S (四)--DAL数据层以及数据接口

    数据层以及数据接口设计如下图(以g_orga组织机构和g_role角色)为例,这几个类可以通过.tt模版生成 设计参考学习http://www.cnblogs.com/hanyinglong/arch ...

  10. CentOS7与Win7双系统引导问题

    先安装的Win7,后安装的CentOS7,结果系统引导就只有CentOS7了.记得以前CentOS6.x系列没这个问题,主要是由于CentOS7.x使用grub2的原因吧. 方案一:使用Win PE. ...