使用pie.htc时Border-radius的兼容
如果一个图层中(navin)使用了pie.htc来对ie6,7,8进行兼容,如若上一层(navwrap)的样式中有背景的属性,则此层 (navin) 在ie6,7,8中背景颜色不显示。如下图:
此部分的代码如下:
.navwrap { height:162px; background:#009BBD; }
.navin { height:33px; border-radius:17px; font-size:16px; color:#fff; padding-left:15px; line-height:33px; behavior:url(/Public/PIE.htc); position:relative; }
此代码中能显示深蓝色圆角的背景颜色关键是代码中的红色属性position:relative;
如若没有这个属性,则navin的背景颜色在ie6,7,8(即用pie来模拟显示css3的浏览器)中是无法显示的,即忽略这个属性。
所以,解决办法是:
圆角所在图层,即在定义pie.htc的图层上加上position:relative就可以了。
<div class="navwrap">
<div class="navin">
<a href="#">首页</a><a href="#">我的资源库</a>
</div>
</div>
此代码中能显示深蓝色圆角的背景颜色关键是代码中的红色属性position:relative;
如若没有这个属性,则navin的背景颜色在ie6,7,8(即用pie来模拟显示css3的浏览器)中是无法显示的,即忽略这个属性。
所以,解决办法是:
圆角所在图层,即在定义pie.htc的图层上加上position:relative就可以了。