今天在整理IE滤镜时网站访问这里,居然找到模糊滤镜blur(),感觉太不可思议了,想不到IE居然会有这么多种滤镜效果,这基本上是模仿PS的。今天的重点是模糊滤镜

CSS模糊效果及其兼容方法

实例
兼容方法
  • chrome:-webkit-filter:blur(3px);
  • IE8及以下:需要注意的是IE下模糊程度较浅一点,可以将PixelRadius的值适当调大一些
filter: progid:DXImageTransform.Microsoft.Blur(PixelRadius='5');
  • FireFox:filter:url(blur.svg#blur);

    需要引入blur.svg文件,其文件内容是:
<svg version="1.1" xmlns="http://www.w3.org/2000/svg">
<filter id="blur">
<feGaussianBlur stdDeviation="3" />
</filter>
</svg>

可以拷贝下来另存为blur.svg;

CSS模糊效果及其兼容方法的更多相关文章

  1. placeholder兼容方法(兼容IE8以上浏览器)

    //placeholder兼容方法(兼容IE8以上浏览器) var JPlaceHolder = { //检测 _check: function () { return 'placeholder' i ...

  2. 为IE单独写CSS的三种方法

    本文由 Kayo Lee 发表,本文链接:http://kayosite.com/the-methods-make-css-only-for-ie.html 因为万恶的 IE 存在各种的不标准,因此, ...

  3. 三种纯CSS实现三角形的方法

    看到像上图这样的 tip 的小三角,你会怎么办? 切个图上去?恩,不错,简单,兼容性也一级棒,不但好控制,那点小东西也增加不了多少图片的大小.但有没有更好更讲究技巧的办法呢?哈哈,那必须有啊,而且还不 ...

  4. CSS清除浮动的方法

    CSS清除浮动的方法有哪些呢?经常性地会使用到float,很多邪门的事儿都有可能是浮动在作怪,清除浮动是必须要做的,而且随时性地对父级元素清除浮动的做法也被认为是书写CSS的良好习惯之一.下面看今天的 ...

  5. div+css 布局下兼容IE6 IE7 FF常见问题

    div+css 布局下兼容IE6 IE7 FF常见问题 收藏 所有浏览器 通用 (市面上主要用到的IE6 IE7 FF)height: 100px; IE6 专用 _height: 100px; IE ...

  6. CSS3新特性,兼容性,兼容方法总结

    css3手册css3手册 边框 border-radius 用于添加圆角效果 语法: border-radius:[ <length> | <percentage> ]{1,4 ...

  7. 奥森图标和CSS特殊字体使用方法

    作为第一篇博文,写这个 我快要被气炸,好吧,废话不说了 昨天在项目中发现有很多这些Awesome图标 也在网上找了下Font Awesome下载后这些文件,现在的版本是4.2,Font Awesome ...

  8. 转贴:获取元素CSS值之getComputedStyle方法熟悉

    获取元素CSS值之getComputedStyle方法熟悉 一.碎碎念~前言 我们都用过jQuery的CSS()方法,其底层运作就应用了getComputedStyle以及getPropertyVal ...

  9. 在线生成CSS样式和兼容的字体格式

    http://www.fontsquirrel.com/tools/webfont-generator 在线生成CSS样式和兼容的字体格式.

随机推荐

  1. 转载 Python 正则表达式入门(初级篇)

    Python 正则表达式入门(初级篇) 本文主要为没有使用正则表达式经验的新手入门所写.转载请写明出处 引子 首先说 正则表达式是什么? 正则表达式,又称正规表示式.正规表示法.正规表达式.规则表达式 ...

  2. 写好Java代码的30条经验总结

    成为一个优秀的Java程序员,有着良好的代码编写习惯是必不可少的.下面就让我们来看看代码编写的30条建议吧. (1) 类名首字母应该大写.字段.方法以及对象(句柄)的首字母应小写.对于所有标识符,其中 ...

  3. 14-01 Java matches类,Pattern类,matcher类

    Pattern类 正则表达式常见规则 A:字符 x 字符 x.举例:'a'表示字符a \\ 反斜线字符. \n 新行(换行)符 ('\u000A') \r 回车符 ('\u000D') B:字符类 [ ...

  4. Retrofit2+Rxjava2的用法

    近几年,Retrofit犹如燎原之火搬席卷了整个Android界.要是不懂Retrofit,简直不好意思出门... 由于近几个项目都没用到Retrofit,无奈只能业余时间自己撸一下,写的不好的地方, ...

  5. nginx介绍(六) - 通过反向代理实现跨域访问

    前言 跨域访问问题, 相信很多人都遇到过, 并且都用不同的办法去解决过. 方法有很多种, 不一一叙述了. 这里主要使用nginx反向代理来解决跨域问题. 啥是跨域 假如你是百度开发人员, 在百度页面去 ...

  6. kafka集群partition分布原理分析

    1. Kafka集群partition replication默认自动分配分析 下面以一个Kafka集群中4个Broker举例,创建1个topic包含4个Partition,2 Replication ...

  7. JS下计算当前日期(当天)后N天出现NAN或者undefined的情况

    前言: 帮客户做一个订单系统,需要一个日期1,一个日期2,默认情况下日期1为当天,日期2为明天,只是当时有些疑惑的是日期2偶尔会出现NAN的情况,今天在segmentfault.com看到了同样的问题 ...

  8. Docker系列之Docker容器(读书笔记)

    一.介绍 容器是独立运行的一个或一组应用,以及它们的运行态环境.对应的,虚拟机可以理解为模拟运行的一整套操作系统和排在上面的应用. 二.容器 2.1 启动容器 启动容器有两种方式,一种是基于镜像新建一 ...

  9. Java设计模式学习记录-享元模式

    前言 享元模式也是一种结构型模式,这篇是介绍结构型模式的最后一篇了(因为代理模式很早之前就已经写过了).享元模式采用一个共享来避免大量拥有相同内容对象的开销.这种开销最常见.最直观的就是内存损耗. 享 ...

  10. [转]微擎应用笔记3--manifest.xml文件使用说明

    本文转自:https://blog.csdn.net/seven_north/article/details/79508121 微擎在安装或卸载模块时会根据manifest.xml生成(或删除)数据库 ...