https://msdn.microsoft.com/en-us/library/ms533087(v=vs.85).aspx这是官网地址
css3在ie6,7,8的兼容性很差,这时候可以用ie自带的滤镜来实现效果,比如阴影,透明度,
1.Alpha,调整对象内容的不透明度。
语法:
filter:progid:DXImageTransform.Microsoft.Alpha()
/*完整写法*/
filter:progid:DXImageTransform.Microsoft.Alpha(enabled='ture',GradientType='1',StartColorStr='#00000000',EndColorStr='#FFFF3300')
-
Style,设置或者调整不透明度的风格。0代表默认值,1代表线性不透明,2代表径向渐变,3代表矩形渐变
-
Opacity,设置或调整不透明度值。0~100值,其中0默认值表示全透明,100为全不透明
-
FinishOpacity,设置或调整最后不透明度值。0~100值,其中0默认值表示全透明,100为全不透明
-
StartX,设置或调整水平不透明最开始位置,默认值为0,即从对象最左边开始。
-
FinishX,设置或调整水平不透明度结束位置,默认值为0
-
StartY,设置或调整垂直方向不透明度开始位置,默认值为0
-
FinishY,设置或调整垂直不透明度结束位置,默认值为0
不妨用你的手中的IE6~8来预览一下官方demo→Alpha Filter
2.BasicImage,调整对象的内容的颜色处理、图像旋转或不透明度。
filter:progid:DXImageTransform.Microsoft.BasicImage()
/*完整写法*/
filter:progid:DXImageTransform.Microsoft.BasicImage(Grayscale='x', Xray='x', Mirror='x', Invert='x', Opcity='x', Rotation='x')
-
GrayScale ,设置或调整对象的灰度值。
-
Invert ,设置或调整对象的反相。
-
Opacity ,设置或调整对象的不透明度。
-
Mask ,设置或调整对象的的RGB是否为MashColor值,0默认值,显示正常RGB值,1表示改变内容为MashColor(不常用)
-
Mirror ,设置或调整对象镜像。0正常显示,1内容对象将翻过来。
-
Rotation ,设置或调整对象旋转,0正常显示,1代表旋转90°,2代表旋转180°,3代表旋转270°
-
XRay ,设置或调整对象的X射线,布尔值,0正常显示,1代表X射线,有点像我们去医院拍X光一样的效果。
不妨用你的手中的IE6~8来预览一下官方demo→BasicImage Filter
3.Blur,设置对象的模糊值。
filter:progid:DXImageTransform.Microsoft.Blur()
/*完整写法*/
filter:progid:DXImageTransform.Microsoft.Blur(PixelRadius='x', MakeShadow='x', ShadowOpacity='x')
-
PixelRadius,设置对象的模糊半径,1~100数值。
-
MakeShadow,设置对象是否投影,布尔值,true和false
-
ShadowOpacity,设置对象投影不透明度,0.0~1.0,假如MakeShadow为false那么该值无效。
不妨用你的手中的IE6~8来预览一下官方demo→Blur Filter
**4.Chroma **,设置对象的色彩透明度
filter:progid:DXImageTransform.Microsoft.Chroma()
/*完整写法*/
filter:progid:DXImageTransform.Microsoft.Chroma(Color='x')
Color,设置颜色值。
不妨用你的手中的IE6~8来预览一下官方demo→Chroma Filter
**5.Compositor **,设置新对象内容的合成颜色,这个翻译有点拗口,大概的意思就是:2个对象,要显示哪个或者隐藏哪个,或者显示他们对比之后的新对象。
filter:progid:DXImageTransform.Microsoft.Compositor()
/*完整写法*/
filter:progid:DXImageTransform.Microsoft.Compositor(function='')
其中function值有18个值,很多很多。也不一一说了,有兴趣的的前往这里看demo→Compositor Filter
**6.DropShadow **,设置对象的投影效果。
filter:progid:DXImageTransform.Microsoft.DropShadow()
/*完整写法*/
filter:progid:DXImageTransform.Microsoft.DropShadow(OffX='x', OffY='x', Color='x', Positive='x')
-
OffX,设置投影的X位移,单位数值,默认值为5
-
OffY,设置投影的Y位移,单位数值,默认值为5
-
Color,设置投影的颜色值
-
Positive,设置投影的透明或者非透明。
之前有写过一篇关于css3的shadow文章,有时间的也可以点点。。。
不妨用你的手中的IE6~8来预览一下官方demo→Blur Filter
**7.Emboss **,设置对象的浮雕效果。
filter:progid:DXImageTransform.Microsoft.Emboss()
/*完整写法*/
filter:progid:DXImageTransform.Microsoft.Emboss(Bias='')
一般来说Bias属性不需要设置,可以忽略,官方demo→Emboss Filter
**8.Engrave **,设置对象的雕刻效果。
filter:progid:DXImageTransform.Microsoft.Engrave()
/*完整写法*/
filter:progid:DXImageTransform.Microsoft.Engrave(Bias='')
一般来说Bias属性不需要设置,可以忽略,官方demo→Engrave Filter
**9.Glow **,设置对象的光晕效果。
filter:progid:DXImageTransform.Microsoft.Glow()
/*完整写法*/
filter:progid:DXImageTransform.Microsoft.Glow(color='', Strength='')
-
color,设置光晕颜色。
-
Strength,设置光晕的宽度,数值单位
官方demo→Glow Filter
**10.Light **,设置对象的亮度
filter:progid:DXImageTransform.Microsoft.Light()
-
addAmbient,加入对象环境光
-
addCone ,加入锥形光源
-
addPoint 加入点光源
-
changeColor ,改变亮度颜色
-
changeStrength,改变亮度长度
-
clear,清除亮度
-
moveLight,移动光源焦点。
官方demo→Light Filter
**11.ICMFilter **,设置对象颜色内容改变,使其显示像打印设备的颜色。
官方无demo,IE9时,这个滤镜仅仅应用于屏幕内容显示效果上,当内容是打印时,将不应用。
**12.MaskFilter **,设置对象内容透明或者非透明颜色。
filter:progid:DXImageTransform.Microsoft.MaskFilter()
/*完整写法*/
filter:progid:DXImageTransform.Microsoft.MaskFilter(Color='')
13.Matrix,调整大小、旋转或翻转使用矩阵的内容对象转换。
filter:progid:DXImageTransform.Microsoft.Matrix()
可以设置各种角度的旋转,官方demo→Matrix Filter
14.MotionBlur,设置对象模糊,测试完demo之后感觉有点像线性模糊,就是月光投射下来不均匀的模糊效果。
filter:progid:DXImageTransform.Microsoft.MotionBlur()
/*完整写法*/
filter:progid:DXImageTransform.Microsoft.MotionBlur(Direction='',Strength='',Add='')
-
Direction,设置对象模糊方向,从0°~315°照射下来。
-
Strength ,设置对象模糊范围,单位数值,初始值为5
-
Add,设置图像模糊是否覆盖在原图上,布尔值,true表示覆盖,false表示不覆盖
官方demo→MotionBlur Filter
15.Wave,设置对象为波浪纹滤镜效果
filter:progid:DXImageTransform.Microsoft.Wave()
/*完整写法*/
filter:progid:DXImageTransform.Microsoft.Wave(Add='', LightStrength='', Phase='', Strength='', Freq='')
-
Add,设置滤镜是否覆盖在原图上,布尔值,true表示覆盖,false表示不覆盖
-
LightStrength,亮度强度,0~100数值,数值越大滤镜效果越明显
-
Phase,相对偏移值,0~100数值
-
Strength,设置波浪强度,默认值为5,数值越大,波浪效果越明显。
-
Frep,设置波浪频率,默认值为3,数值越大,波浪效果越明显。
官方demo→Wave Filter
16.Shadow,设置对象阴影效果。
filter:progid:DXImageTransform.Microsoft.Shadow()
/*完整写法*/
filter:progid:DXImageTransform.Microsoft.Shadow(color='', Direction='', Strength='')
-
Color,设置阴影颜色。
-
Direction,设置阴影的方向,角度也是从0°~315°取值(跟PS的投影效果非常的相似。)
-
Strength,设置投影强度,数值越大越模糊。
官方demo→ Filter