Filters主要是运用在图片上，以实现一些特效。（也能运用于video上），类似滤镜效果
 
img {
        -webkit-filter:grayscale(1);
}   
 
grayscale灰度            下面大部分一样，默认值都为100%         
sepia褐色
saturate饱和度
hue-rotate色相旋转     默认值0deg
invert反色
opacity透明度
brightness亮度
contrast对比度
blur模糊                  默认值0
drop-shadow阴影
 
 
 

CSS fliter的更多相关文章

  1. Matplotlib数据可视化（3）：文本与轴

      在一幅图表中,文本.坐标轴和图像的是信息传递的核心,对着三者的设置是作图这最为关心的内容,在上一篇博客中虽然列举了一些设置方法,但没有进行深入介绍,本文以围绕如何对文本和坐标轴进行设置展开(对图像 ...

  2. 使用fliter实现ie下css中rgba的效果

    直接举例吧background-color: rgba(255,255,255,0.8); 设置背景颜色为白色,不透明度设为80% 在ie下可以用fliter这一属性进行设置: filter:prog ...

  3. css相关整理-其他

    1.设备像素(device pixel): 设备像素是物理概念,指的是设备中使用的物理像素.CSS像素(css pixel): CSS像素是Web编程的概念,指的是CSS样式代码中使用的逻辑像素.通过 ...

  4. Struts2的fliter与interceptor

    struts2   fliter与interceptor的区别 1.拦截器是基于java反射机制的,而过滤器是基于函数回调的.2.过滤器依赖于servlet容器,而拦截器不依赖于servlet容器.3 ...

  5. 常用前端布局，CSS技巧介绍

    常用前端布局,CSS技巧介绍 对前端常用布局的整理总结,并对其性能优劣,兼容等情况进行介绍 css常用技巧之可变大小正方形的绘制 1:若通过设置width为百分比的方式,则高度不能通过百分比来控制. ...

  6. html标签和css基础语法与浏览器兼容性等相关基础学习

    <!-- table的使用 --> <h3>前端日常</h3> <form action="https://www.baidu.com"& ...

  7. 10 个 GitHub 上超火的 CSS 奇技淫巧项目，找到写 CSS 的灵感！

    大家好,我是你们的 超级猫,一个不喜欢吃鱼.又不喜欢喵 的超级猫 ~ 如果 CSS 是女孩子,肯定如上图那样吧

  8. CSS的未来

    仅供参考 前言 完成<CSS核心技术与实战>这本书,已有一个多月了,而这篇文章原本是打算写在那本书里面的,但本章讲解的内容,毕竟属于CSS未来的范畴,而这一切都还不能够确定下来,所以这一章 ...

  9. 前端极易被误导的css选择器权重计算及css内联样式的妙用技巧

    记得大学时候,专业课的网页设计书籍里面讲过css选择器权重的计算:id是100,class是10,html标签是5等等,然后全部加起来的和进行比较... 我只想说:真是误人子弟,害人不浅! 最近,在前 ...

随机推荐

  1. 大数据 - Teradata学习体会

    引言 随着计算机系统在处理能力.存储能力等方面,特别是计算机软件技术的不断提高,使得信息处理技术得到飞速发展. 数据处理主要分为两大类:联机事物处理OLTP.联机分析处理OLAP.OLTP也就是传统的 ...

  2. Nexus 私有仓库搭建与 Maven 集成

    Nexus 私有仓库搭建与 Maven 集成 |作者:RexFang |出处:http://www.cnblogs.com/rexfang/ |关于作者:Java 程序员一枚 |版权:本文版权归作者和 ...

  3. BZOJ-1010-[HNOI2008]玩具装箱toy（斜率优化）

    Description P教授要去看奥运,但是他舍不下他的玩具,于是他决定把所有的玩具运到北京.他使用自己的压缩器进行压缩,其可以将任意物品变成一堆,再放到一种特殊的一维容器中.P教授有编号为1... ...

  4. JavaScript设计模式接口

    JavaScript中实现接口的方法有三种: 第一种,使用注释的方法实现接口 特点:(1)最简单,但是功能最弱(2)利用 interface和 implement"文字"(3)把他 ...

  5. javascript特效300例----抄书喽

    -javascript300例- #body_div { background-color: #202425; color: white; margin: 0 auto; border: 5px gr ...

  6. hadoop配置文件详解，安装及相关操作

    一.      Hadoop伪分布配置 1. 在conf/hadoop-env.sh文件中增加:export JAVA_HOME=/home/Java/jdk1.6  2.  在conf/core-s ...

  7. Echarts数据可视化polar极坐标系，开发全解+完美注释

    全栈工程师开发手册 (作者:栾鹏) Echarts数据可视化开发代码注释全解 Echarts数据可视化开发参数配置全解 6大公共组件详解(点击进入): title详解. tooltip详解.toolb ...

  8. 原生js反转字符串

    //直接操作 var str='nama';var rts=str.split('').reverse().join(''); //String上拓展方法String.prototype.revers ...

  9. 页面固定DIV层CSS代码

    有时候为了用户体验更好些,网页设计师会把网站导航放在一个固定的DIV层里面,不随滚动条滚动.本方法是利用CSS,position:fixed属性来固定层,fixed是特殊的absolute,即fixe ...

  10. [转载]Vector用法（C++ Primer中文版）

    转自:http://blog.sciencenet.cn/blog-261330-551086.html vector 是同一种类型的对象的集合,每个对象都有一个对应的整数索引值.和 string 对 ...