让IE6,IE7,IE8支持CSS3的解决方法

CSS 小智 527℃ 0评论

由于公司维护的项目一直要求最低需要支持IE8,但是最近又碰到一些需求是要绘制圆角和阴影图案,在网上查找了许多资料,其中的一种方案是采用ie-css3.htc这样的方案,但是我自己经过测试这种方法并不好使(经过多次测试在IE8上并没有奏效),后来又找到了PIE.htc相关的内容,这才最终的得到解决。
现整理如下:
大致思路就是:在低版本浏览器下,通知IE浏览器加载PIE.js脚本,采用VML(The Vector Markup Language(矢量可标记语言))模拟的方式来实现半透明、阴影 、渐变背景等效果的渲染。
需要引入PIE.htc,PIE.js文件,并且这两个文件的路径需要一致,同时也要特别的注意引用的路径,别出现找不到文件的情况了。
除此以外,采用这用方式可能还需要启用IE浏览器的ActiveX插件,不然就可能不会生效(我测试的时候是这样的)
代码如下:

/*让IE8支持CSS3属性*/
/*圆形*/
.cicyle {
	width: 300px;
	height: 150px;
	line-height: 150px;
	text-align: center;
	background-color: pink;
	margin: 150px auto;
	border-radius: 18px;
	-moz-border-radius: 18px;
	-webkit-border-radius: 18px;
	/* 通知IE浏览器调用脚本,针对IE8及以下版本,特别要注意引用的位置,不然可能会不生效 */
	behavior: url(PIE.htc); 
}

然后在需要的地方引用css即可。
PIE文件及演示内容下载地址: pie_test

本文固定链接:心知博客 » 让IE6,IE7,IE8支持CSS3的解决方法
本站内容除特别标注外均为原创,欢迎转载,但请保留出处!

喜欢 (3)
发表我的评论
取消评论
表情

请填写您的昵称和邮箱!

  • 昵称 (必填)
  • 邮箱 (必填)
  • 网址