0

需要帮助将我在优秀浏览器中工作的一些 css 转换为现在可用于 Internet Explorer。这就是我现在所拥有的

.headerLoginFooter
{   
    background-color:#f5f5f5; 
    padding:7px 10px 7px 10px; 
    margin:20px 0 0 0; 
    -moz-box-shadow:inset 0 8px 6px -6px #c4c4c4; 
    -webkit-box-shadow:inset 0 8px 6px -6px #c4c4c4; 
    box-shadow:inset 0 8px 6px -6px #c4c4c4;
}

最后的三个属性在该 div 的登录框的页脚部分产生向内发光，如下所示

在此处输入图像描述

我能够在CSS Tricks中获取此样式的代码，但我需要使其与 Internet Explorer 兼容。我的第一个问题是我只有一个 mac，所以我没有 Internet Explorer 来轻松测试我的代码。我的第二个问题是我没有像他在他的代码中那样转换上面的代码。有人可以按照链接中的指南帮助我将上述代码转换为适用于 Internet Explorer。谢谢你。

4

1 回答 1

0

IE对许多 CSS3 功能非常有问题，尤其是旧版本。

我建议在你的 CSS 样式表中使用CSSpie。之前已在此处回答了此问题。

有些事情可以阻止 box-shadow 在 IE 中工作：（如果它们应用于同一个元素）

  • 圆角 /border-radius
  • overflow:hidden
  • background-color
  • 背景渐变

为了克服这个问题，我通常在我想用盒子阴影设置样式的容器中嵌套一个容器。

<style>
.boxShadow {
 behavior: url(PIE.htc);
 -webkit-box-shadow: inset 0 8px 6px -6px #c4c4c4;  
 -moz-box-shadow: inset 0 8px 6px -6px #c4c4c4;  
 box-shadow: inset 0 8px 6px -6px #c4c4c4; 
overflow:visible;
}
.otherStyles{
background-color:#f5f5f5;
border-radius:0px;/*or other value*/
/*gradients can be placed here too.*/
}
</style>
<div class="boxShadow">
  <div class="otherStyles">
     ...content...
  </div>
</div>
于 2013-03-01T23:02:48.573 回答