3

CSS3 - 使用 CSS3 过渡时，图像不会在 IE 中显示。我不介意动画在 IE 中是否不起作用，但我至少希望图像在 IE 中正常显示。下面是我的代码：

HTML：

    <div id="bg">
    <img class="fadeIn fadeIn-3s fadeIn-Delay-3s" src="images/about-phil.jpg" alt="Phil Davel About Us Background Image">
</div>

CSS：

.fadeIn {
opacity:0;
-webkit-animation:fadeIn ease-in 1;
-moz-animation:fadeIn ease-in 1;
-o-animation:fadeIn ease-in 1;
animation:fadeIn ease-in 1;
-webkit-animation-fill-mode:forwards;
-moz-animation-fill-mode:forwards;
-o-animation-fill-mode:forwards;
animation-fill-mode:forwards;
margin-bottom: -10px;

}

.fadeIn-3s {
    -webkit-animation-duration:3s;
    -moz-animation-duration:3s;
    -o-animation-duration:3s;
    animation-duration:3s;
}

.fadeIn-Delay-3s {
    -webkit-animation-delay:1s;
    -moz-animation-delay:1s;
    -o-animation-delay:1s;
    animation-delay:1s;
}
4

1 回答 1

0

IE 不支持 CSS3 动画。

如果用户使用 IE，您可以在 HTML 中使用条件语句来包含额外的 CSS 文件。通过这样做，您可以为 IE 以不同的方式显示图像。

<!--[if IE]>
    <link rel="stylesheet" type="text/css" href="ie.css" />
<![endif]-->
于 2013-01-14T20:42:40.090 回答