Question

我有一个Joomla3网站，其自定义模板在大多数浏览器中都很好看，但在IE8中却很糟糕。很多元素似乎没有采用背景颜色，只是白色。

例如，页脚通常具有背景颜色。当我查看template.css文件（从bootstrap和我的自定义template.less文件编译）时，您可以看到页脚格式

.footer  .container {
  padding: 5px;
  border: 3px solid #bbbbbb;
  padding-top: 0px;
  border-top: 0px;
  -webkit-border-radius: 0px 0px 4px 4px;
  -moz-border-radius: 0px 0px 4px 4px;
  border-radius: 0px 0px 4px 4px;
  background-color: rgba(245,248,250,0.7);
}

但是当我使用ie8的网站开发工具（通过我的Mac上的葡萄酒 - 如果有所作为）来检查为什么它在ie8中只是白色，我看到了

screenshot

似乎表明.footer .container的背景色被忽略了。为什么会这样？这是因为它被较少的编译器编译成rgba格式吗？

非常感谢您对此的任何帮助以及我如何解决它。

Answer 1

IE8不支持CSS3颜色，例如rgba()，这就是它无法正常工作的原因。

如果您想在IE8中获得支持，则必须采用另一种方法来指定background-color。如果您不介意失去透明度，请使用background-color:rgb(245,248,250);或.. background-color: #F5F8FA;

请参阅http://caniuse.com/css3-colors

Answer 2

您可以在网站上导入css3.js。这个javascript文件允许您使用CSS3属性，这些属性可以在通常不支持它的旧浏览器上运行。

http://imsky.github.io/cssFx/

导入后，您可以像以前一样使用以下内容：

background-color: rgba(245,248,250,0.7);

为了安全起见，我认为这样做总是很好的做法，只需要这样做，就像这样：

background-color: #F5F8FA;
background-color: rgba(245,248,250,0.7);

请注意，回退发生在rgba()

之前

希望这有帮助

Answer 3

在企业模式下使用IE11时遇到了同样的问题。

我有这样的风格集：

.heading {
            background-color:#f1f1ef;
            border-style:solid;
            border-color:#E4E3DD;
            border-width:1px;
        }

我的表标题没有背景颜色：

<th class="heading">Test</th>

我必须手动设置属性bgcolor才能在企业模式下工作：

<th class="heading" bgcolor="#f1f1ef">Test</th>

ie8没有拿起背景颜色

3 个答案: