0

私はそれがサポートされていないことを知っています...私は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」のようなURLがあります。

.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);
}
4

2 に答える 2

1

私は少し前にこれをあきらめました。そして解決策は次のとおりです。IE6、7、8についてラットのお尻を与えないでください。

于 2014-02-25T13:58:15.350 に答える
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>
于 2014-02-25T14:03:40.047 に答える