IE6,7,8中的CSS box-shadow

时间:2013-01-14 20:18:08

标签: css css3 css3pie

我知道它不受支持......我试过PIE。 我已将PIE.htc文件放在与CSS相同的文件夹中,并放在IMAGE文件夹中。 使用“../ images/image.png”路径可以正确加载图像。

以下是代码:

.ma-footer-container { 
background: #fff;
margin:0px auto; 
color: #333333; 
padding-top: 10px; 
-moz-box-shadow: 0 10px 80px 0 rgba(0, 0, 0, 0.33);
-webkit-box-shadow: 0 10px 80px 0 rgba(0, 0, 0, 0.33); 
box-shadow: 0 10px 80px 0 rgba(0, 0, 0, 0.33); 
behavior: url(PIE.htc);
}

另一次尝试:

.ma-footer-container { 
background: #fff;
margin:0px auto; 
color: #333333; 
padding-top: 10px; 
-moz-box-shadow: 0 10px 80px 0 rgba(0, 0, 0, 0.33);
-webkit-box-shadow: 0 10px 80px 0 rgba(0, 0, 0, 0.33); 
box-shadow: 0 10px 80px 0 rgba(0, 0, 0, 0.33); 
behavior: url(../images/PIE.htc);
}

没有任何影响。看起来盒子阴影完全被忽略了。不在IE开发人员工具中显示......

这是另一种尝试(使用绝对路径)。我使用的图像有如下网址: “http://www.myStore.com/skin/frontend/default/ma_kidstore/images/facebook_icon.png”

.ma-footer-container { 
background: #fff;
margin:0px auto; 
color: #333333; 
padding-top: 10px; 
-moz-box-shadow: 0 10px 80px 0 rgba(0, 0, 0, 0.33);
-webkit-box-shadow: 0 10px 80px 0 rgba(0, 0, 0, 0.33); 
box-shadow: 0 10px 80px 0 rgba(0, 0, 0, 0.33); 
behavior: url(/skin/frontend/default/ma_kidstore/images/PIE.htc);
}

2 个答案:

答案 0 :(得分:1)

我刚才放弃了这个。 解决方案是:我不给老鼠屁股关于IE6,7和8。

答案 1 :(得分:0)

不知何故,我也无法使用CSS应用PIE,但JavaScript解决方案帮助我解决了这个问题。

在HTML文件的标记中

<!--[if lte IE 8]>
  <script src="styles/build/PIE.js"></script> 
<![endif]-->

之后,或者在结束前的页面末尾,

<script type="text/javascript">
// providing CSS3 Pie behavior to elements
if(window.PIE)
{
  var containers = document.querySelectorAll('.ma-footer-container');
  for(var i = 0; i < containers.length; i++)
  {
    PIE.attach(containers[i]);
  } 
}
</script>