当前位置:首页> 正文
ie-css3.htc 让IE6, 7, and 8也支持box-shadow
首先下载ie-css3.htc脚本,然后在css中加入:
它的使用方法是:下载它并放到你的服务器目录
在你的head/head里面写入下面的代码:
复制代码代码如下:
.box {
-moz-border-radius: 15px; /* Firefox */
-webkit-border-radius: 15px; /* Safari and Chrome */
border-radius: 15px; /* Opera 10.5+, future browsers, and now also Internet Explorer 6+ using IE-CSS3 */
-moz-box-shadow: 10px 10px 20px #000; /* Firefox */
-webkit-box-shadow: 10px 10px 20px #000; /* Safari and Chrome */
box-shadow: 10px 10px 20px #000; /* Opera 10.5+, future browsers and IE6+ using IE-CSS3 */
behavior: url(ie-css3.htc);
}
注意:behavior: url(ie-css3.htc) 中的ie-css3.htc地址用绝对路径或者直接传到网站的根目录下面,要不然可能会看不到效果。
IE-CSS3.HTC下载地址:
下载地址: 点击下载 前往官网
当你使用了这个htc文件后,你的CSS里面,只要写有box-shadow, -moz-box-shadow或-webkit-box-shadow的任何一种,IE就会渲染。
当使用了这个htc文件后,你不能这样写box-shadow: 0 0 10px red; 而应该是box-shadow: 0px 0px 10px red; 否则IE中会失效。
不支持RGBA值中的alpha透明度。
不支持inset内阴影。
不支持阴影扩展。
阴影在IE中只会显示为黑色,不管你设置成其它什么颜色。
但是,这个脚本了仅仅是让IE支持了部份的box-shadow值。
方法二:
在head/head标签里加入如下代码:
复制代码代码如下:
style type="text/css"
img{background: #fff;
-ms-filter:"progid:DXImageTransform.Microsoft.Shadow(color=#eeeeee,direction=0,strength=6) progid:DXImageTransform.Microsoft.Shadow(color=#dddddd,direction=90,strength=10) progid:DXImageTransform.Microsoft.Shadow(color=#dddddd,direction=180,strength=10) progid:DXImageTransform.Microsoft.Shadow(color=#eeeeee,direction=270,strength=6)";
*filter:
progid:DXImageTransform.Microsoft.Shadow(color=#eeeeee,direction=0,strength=6)
progid:DXImageTransform.Microsoft.Shadow(color=#dddddd,direction=90,strength=10)
progid:DXImageTransform.Microsoft.Shadow(color=#dddddd,direction=180,strength=10)
progid:DXImageTransform.Microsoft.Shadow(color=#eeeeee,direction=270,strength=6);
}
/style
其中:color是投影的颜色,direction是顺时针的角度值,strength是投影的大小值。
它的使用方法是:下载它并放到你的服务器目录
在你的head/head里面写入下面的代码:
复制代码代码如下:
.box {
-moz-border-radius: 15px; /* Firefox */
-webkit-border-radius: 15px; /* Safari and Chrome */
border-radius: 15px; /* Opera 10.5+, future browsers, and now also Internet Explorer 6+ using IE-CSS3 */
-moz-box-shadow: 10px 10px 20px #000; /* Firefox */
-webkit-box-shadow: 10px 10px 20px #000; /* Safari and Chrome */
box-shadow: 10px 10px 20px #000; /* Opera 10.5+, future browsers and IE6+ using IE-CSS3 */
behavior: url(ie-css3.htc);
}
注意:behavior: url(ie-css3.htc) 中的ie-css3.htc地址用绝对路径或者直接传到网站的根目录下面,要不然可能会看不到效果。
IE-CSS3.HTC下载地址:
下载地址: 点击下载 前往官网
当你使用了这个htc文件后,你的CSS里面,只要写有box-shadow, -moz-box-shadow或-webkit-box-shadow的任何一种,IE就会渲染。
当使用了这个htc文件后,你不能这样写box-shadow: 0 0 10px red; 而应该是box-shadow: 0px 0px 10px red; 否则IE中会失效。
不支持RGBA值中的alpha透明度。
不支持inset内阴影。
不支持阴影扩展。
阴影在IE中只会显示为黑色,不管你设置成其它什么颜色。
但是,这个脚本了仅仅是让IE支持了部份的box-shadow值。
方法二:
在head/head标签里加入如下代码:
复制代码代码如下:
style type="text/css"
img{background: #fff;
-ms-filter:"progid:DXImageTransform.Microsoft.Shadow(color=#eeeeee,direction=0,strength=6) progid:DXImageTransform.Microsoft.Shadow(color=#dddddd,direction=90,strength=10) progid:DXImageTransform.Microsoft.Shadow(color=#dddddd,direction=180,strength=10) progid:DXImageTransform.Microsoft.Shadow(color=#eeeeee,direction=270,strength=6)";
*filter:
progid:DXImageTransform.Microsoft.Shadow(color=#eeeeee,direction=0,strength=6)
progid:DXImageTransform.Microsoft.Shadow(color=#dddddd,direction=90,strength=10)
progid:DXImageTransform.Microsoft.Shadow(color=#dddddd,direction=180,strength=10)
progid:DXImageTransform.Microsoft.Shadow(color=#eeeeee,direction=270,strength=6);
}
/style
其中:color是投影的颜色,direction是顺时针的角度值,strength是投影的大小值。
展开全文阅读
相关内容
-
txt文件是什么|TXT文件转为Excel文件的方法
txt文件是什么|TXT文件转为Excel文件的方法,文件,方法,转为,...
-
系统垃圾文件怎么清理|windows磁盘空间清理方法
系统垃圾文件怎么清理|windows磁盘空间清理方法,磁盘,空间清...
-
怎么将ppt转换成word|ppt转换成word文件的简单
怎么将ppt转换成word|ppt转换成word文件的简单方法,转换成,方...
-
提取文字的软件免费那个好用|几款宝藏软件支持
提取文字的软件免费那个好用|几款宝藏软件支持图片免费转文...
-
miui11适配机型有哪些? miui11支持手机汇总
miui11适配机型有哪些? miui11支持手机汇总,支持,机型,有哪些...
-
heic格式图片电脑怎么打开|heic文件照片怎么直
heic格式图片电脑怎么打开|heic文件照片怎么直接看,文件,照片...
-
本地图片预览(支持IE6/IE7/IE8/Firefox3)经验总
本地图片预览(支持IE6/IE7/IE8/Firefox3)经验总结,支持,图片...
-
让IE6、IE7、IE8支持CSS3的圆角、阴影样式
让IE6、IE7、IE8支持CSS3的圆角、阴影样式,圆角,支持,测试,渐...
-
让IE6支持HTML5元素的方法
让IE6支持HTML5元素的方法,方法,元素,支持,文件,网站,脚本,前...
-
让IE8和IE9支持eWebEditor在线编辑器的方法
让IE8和IE9支持eWebEditor在线编辑器的方法,方法,在线,函数,...
-
ie8 不支持new Date(2012-11-10)问题的解决方法
ie8 不支持new Date(2012-11-10)问题的解决方法,解决方法,分...
-
php中强制下载文件的代码|解决了IE下中文文件名
php中强制下载文件的代码|解决了IE下中文文件名乱码问题,中文...
-
ie 7/8不支持trim的属性的解决方案
ie 7/8不支持trim的属性的解决方案,方法,复制,浏览器,属性,解...
-
网页右键ie不支持event.preventDefault和event.
网页右键ie不支持event.preventDefault和event.returnValue ...
-
IE6不支持position:fixed bug的完美解决
IE6不支持position:fixed bug的完美解决,完美,复制,表达式,浏...