今天在整理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中关键字global与nonlocal的区别

    转载自CSDN 雁丘1990, 原文地址: https://blog.csdn.net/xcyansun/article/details/79672634 这篇文章写的很赞, 条理清晰, 分析循序渐进 ...

  2. Devops流程规范

    芯盾时代_Devops_Docker操作说明及使用规范 北京芯盾时代科技有限公司 2019年1月 修订记录 版本号 修订人 修订日期 修订描述 v0.1 芯盾 2019/1/15 初次创建 v0.2 ...

  3. 我是如何利用Github Pages搭建起我的博客,细数一路的坑

    1.前言 其实早在这之前我就一直想过写博客,但由于种种原因一直没有去学习这方面的知识,最近半个月(从开始动手到搭建好)一直陆陆续续的在着手这方面的工作.从开始到搭建完成的过程中遇到了很多困难,因为在这 ...

  4. gulp和grunt 分享ppt

    gulp是前端开发过程中对代码进行构建的工具,是自动化项目的构建利器:她不仅能对网站资源进行优化,而且在开发过程中很多重复的任务能够使用正确的工具自动完成:使用她,我们不仅可以很愉快的编写代码,而且大 ...

  5. Android_性能优化转载

    胡凯 RSS Blog Archives Android Training in Chinese About Android性能优化典范 JAN 17TH, 2015 | COMMENTS 2015年 ...

  6. 最全的maven的pom.xml文件详解

    pom.xml代码: <project xmlns="http://maven.apache.org/POM/4.0.0" xmlns:xsi="http://ww ...

  7. Shell脚本 | 健壮性测试之空指针检查

    通过 "adb shell am start" 遍历安卓应用所有的 Activity,可以检查是否存在空指针的情况. 以下为梳理后的测试流程: 通过 apktool 反编译 apk ...

  8. Java 面试基础总结(一)

    1.九种基本数据类型的大小以及它们的封装类 java提供的九种基本数据类型:boolean.byte(1).char(2).short(2).int(4).long(8).float(4).doubl ...

  9. LearnOpenGL学习笔记(二)——着色器简单理解

    着色器在OpenGL中发挥着重要作用,它就像一个画笔,将输入的数据流,转为数学坐标,再将三维坐标变成二维坐标(针对我们现在用的二维显示器,全息显示器肯是三维的),再把二维坐标实际的像素点位置(这里面肯 ...

  10. Modifying namespace in XML document programmatically

    Modifying namespace in XML document programmatically static XElement stripNS(XElement root) { return ...