css3filterurl的简单介绍
怎么用点九图在手机上做毛玻璃效果用xml来表达的
是CSS3 blur滤镜实现的效果
1，测试代码
.blur?{????
????-webkit-filter:?blur(10px);?/*?Chrome,?Opera?*/
???????-moz-filter:?blur(10px);
????????-ms-filter:?blur(10px);????
????????????filter:?blur(10px);????
}
2，相关HTML代码
img?src="mm1.jpg"?/
img?src="mm1.jpg"?class="blur"?/
3 , 也可以通过SVG滤镜实现
?xml?version="1.0"?encoding="utf-8"?
!DOCTYPE?svg?PUBLIC?"-//W3C//DTD?SVG?1.1//EN"?"
svg?version="1.1"?
?????xmlns="
?????xmlns:xlink="
?????xmlns:ev="
?????baseProfile="full" ?
????defs
????????filter?id="blur"
????????????feGaussianBlur?stdDeviation="10"?/
????????/filter
????/defs
/svg
上面代码红色高亮的就是添加的滤镜代码（其他代码Dreamweaver自动生成，其实，只要一行就够了~）。
CSS调用代码
filter:?url(blur.svg#blur);?/*?FireFox,?Chrome,?Opera?*/
完整的css代码
.blur?{????
02????????filter:?url(blur.svg#blur);?/*?FireFox,?Chrome,?Opera?*/????
03?????????????
04????????-webkit-filter:?blur(10px);?/*?Chrome,?Opera?*/????
05???????????-moz-filter:?blur(10px);????
06????????????-ms-filter:?blur(10px);???????
07????????????????filter:?blur(10px);????
08?????????????
09????????filter:?progid:DXImageTransform.Microsoft.Blur(PixelRadius=10,?MakeShadow=false);?/*?IE6~IE9?*/????
10????}
css 图片变黑白效果 使用CSS将图片转换成黑白的 兼容方法
直接将其放入页面中的style/style即可，或者外部样式直接在内部引用。
html,body?{?
-webkit-filter:?grayscale(100%);?
-moz-filter:?grayscale(100%);?
-ms-filter:?grayscale(100%);?
-o-filter:?grayscale(100%);?
filter:?grayscale(100%);?
filter:?gray;?
}
CSS3模糊滤镜如何应用在背景上而不影响其中内容的显示？
滤镜属性被子元素继承了，这个纯css不能解决，这玩意子继承了父的模糊根本覆盖不了：
body
div id="a"id=a这层单独放：图片背景+模糊滤镜/div
!--? 下面id=b这个div里面才放你网页主要结构 --
div id="b"
div class="horizontal-scroll-area" style="width:3000px;"/div
? ? ????div class="horizontal-scroll-pips"/div
/div
/body
然后：
----------------------------------------------------------------------
css 定位属性让 b 重叠在 a 上面合适位置
(给a、b外面再加个父级并相对定位，a、b分别绝对定位)
弄个js，判断 a、b 两个区域的高度，让矮的那个始终高度等于高的那个
(现成的js网上到处都是，自己百度)