IE8兼容border-radius

最近在写PC端活动页面,UI给的设计稿里边有大量的圆角。咨询过做PC端的同事,说只能兼容到IE9。但是心里不甘心,于是在网上找到了PIE.htc文件。发现它能完美兼容IE8。在这里我把代码步骤给大家罗列一下。
1.下载PIE.htc文件。放到任意位置,前提是你引用的时候可以找得到。
2.给需要设置圆角的元素添加样式:
position:relative;
z-index:2;
-webkit-border-radius: 10px;
-moz-border-radius: 10px;
border-radius: 10px;
behavior: url(PIE.htc);
就是这么简单。这时候你会发现在IE8下也完美实现圆角了。
说两点值得注意的地方:
1.元素的position:relative或者absolute
2.z-index比周围元素高。
另外我这个只是在IE8上测试是完美的,不知道IE6-IE7的情况。但是据说是可以的。
另,有不明白的,可微博找我。
微博:璐飞童鞋。关注之后,私信我问题就可以。

发布了41 篇原创文章 · 获赞 24 · 访问量 13万+
展开阅读全文

没有更多推荐了,返回首页

©️2019 CSDN 皮肤主题: 编程工作室 设计师: CSDN官方博客

分享到微信朋友圈

×

扫一扫,手机浏览