关注到它是在一次分享会当中，很神奇，只需写一行代码就可以变身很美的视觉效果，这就是CSS3滤镜。

语法

filter:fuction(param);

如今浏览器支持情况相比以前乐观很多，点击查看兼容

方法

1.blur模糊

2.brightness亮度

3.contrast对比度

4.grayscale灰度

5.hue-rotate色相旋转

6.invert反色

7.opacity透明度

8.saturate饱和度

9.sepia褐色

10.drop-shadow阴影

效果（非截图）

调整数值看效果，go~

比较喜欢的三种滤镜

CSS3 Filter滤镜效果的更多相关文章

  1. CSS3 filter 模糊滤镜的应用

    CSS3 filter 模糊滤镜的应用   在segmentfault上回答过的一个问题,如何将网页CSS背景图高斯模糊且全屏显示当时没有深入了解,只觉得滤镜应该只是应用于图片上的.而且各大网站的de ...

  2. CSS3 Filter详解（改变模糊度 亮度 透明度等方法）

    CSS3 Filter(滤镜)属性提供了提供模糊和改变元素颜色的功能.CSS3 Fitler 常用于调整图像的渲染.背景或边框显示效果. -webkit-filter是css3的一个属性,Webkit ...

  3. CSS3 filter:drop-shadow滤镜与box-shadow区别应用 抄的

    CSS3 filter:drop-shadow滤镜与box-shadow区别应用 这篇文章发布于 2016年05月18日,星期三,01:07,归类于 css相关. 阅读 5777 次, 今日 12 次 ...

  4. [转]CSS3 Filter的十种特效

    最近到处看到有人在说CSS3的filter一直没有时间自己去测试这效果.今天终于抽出时间学习这个CSS3的Filter.不整不知道呀,一整才让我感到吃惊,太强大了.大家先来看个效果吧: 我想光看上面的 ...

  5. CSS3 Filter特效

    CSS3 filter和IE的filter完全是两样东东. Filters主要是运用在图片上,以实现一些特效.(尽管他们也能运用于video上),不过我们在些只来讨论图片上的运用. 语法 elm { ...

  6. 巧用 CSS3 filter(滤镜) 属性

    原文链接:CSS3 filter(滤镜) 属性 效果预览 filter: grayscale(100%); 定义和使用 filter 属性定义了元素(通常是<img>)的可视效果(例如:模 ...

  7. filter滤镜效果(css3属性)

    <!DOCTYPE html> <html> <head> <style> img { width: 33%; height: auto; float: ...

  8. css3 filter属性在项目中的应用

    css3 属性filter应用在项目里. 语法: <filter>: 要使用的滤镜效果.多个滤镜之间用空格隔开. 设置或检索对象所应用的滤镜效果. 最常用的滤镜效果是不透明效果,如果要实现 ...

  9. 【转载】CSS3 filter:drop-shadow滤镜与box-shadow区别应用

    文章转载自 张鑫旭-鑫空间-鑫生活 http://www.zhangxinxu.com/wordpress/ 原文链接:http://www.zhangxinxu.com/wordpress/?p=5 ...

随机推荐

  1. 需要我们了解的SQL Server阻塞原因与解决方法

    需要我们了解的SQL Server阻塞原因与解决方法 上篇说SQL Server应用模式之OLTP系统性能分析.五种角度分析sql性能问题.本章依然是SQL性能 五种角度其一“阻塞与死锁” 这里通过连 ...

  2. C#中WindowsForm常见控件的运用

    C#中WindowsForm常见控件的运用 -- 1.button(曹操,贡天子以令不臣): 属性;text:我们经常可以看见将按钮命名为“登入”,在其属性面板里面编辑text即可:如下图:      ...

  3. Visual Studio属性配置中使用宏

    在学习C语言的时候,我们曾经遇到过一个宏的概念.宏的作用机理本质上是宏的展开,C语言中的宏的用法也有很多种(水其实很深...),不过从感觉上来讲,人们大致上会在以下的场景中,利用宏来解决一些窘境:一是 ...

  4. android 豆瓣客户端 视频

    链接如下:http://download.csdn.net/detail/jltxgcy/5667337

  5. 最近修bug的一点感悟

    写在前面话 项目从13年1月份,现场开发,4月中旬,项目开发接近尾声,三个开发,留两个在现场,我被调回公司,5月份现场一同事离职,只有一个同事在开发,结果PM想让这一个同事承担余下的开发和bug工作, ...

  6. 结构-行为-样式 - Angularjs 环境下Ztree结合JqueryUI实现拖拽

    新的项目中有一个需求是要求客户标签可以自定义,于是就想到了客户体验,让客户自己拖拽标签进行组合查询.但是理想很丰满,现实很骨感.一开始就遇到了问题,各个插件之间的结合问题,折腾一翻之后终于实现了这个功 ...

  7. ASP.NET Zero--11.一个例子（4）商品分类管理-数据检验

    虽然已经可以添加商品分类,但还需进行优化,比如:用户是否输入.输入字符串是否有格式限制等等. 打开添加分类按钮,名称不输入任何字符,直接保存,会发现列表添加一条空记录.在实际项目中,这是不允许出现的事 ...

  8. jquery中这句 .stop(false,true); 什么意思

    .stop 是jQuery中用于控制页面动画效果的方法.运行之后立刻结束当前页面上的动画效果.stop在新版jQuery中添加了2个参数:第一个参数的意思是是否清空动画序列,也就是stop的是当前元素 ...

  9. 有关css3的一些问题

    CSS3新特性(阴影.动画.渐变.变形.伪元素等) CSS3与页面布局学习总结--CSS3新特性(阴影.动画.渐变.变形.伪元素等)     目录 一.阴影 1.1.文字阴影 1.2.盒子阴影 二.背 ...

  10. iOS软件架构——架构模式(Architectural Pattern)

    一个架构模式描述软件系统里的基本的结构组织或纲要.架构模式提供一些事先定义好的子系统,指定它们的责任,并给出把它们组织在一起的法则和指南.有些作者把这种架构模式叫做系统模式[STELTING02]. ...