html - IE 不在 FLOAT 左类中显示图像。适用于 Chrome 和 Firefox

Question

我的问题出在 IE(版本 11 和 Vista 上的一些旧版本)中。页面 holzhandel.cz 在 IE 中不显示图像(在 chrome 和 fox 中显示)。这是一个非常简单的页面，类只是向左浮动和简单的 img 标签。

(CSS 文件)

.pic img{
    height: 600px;
    width: 100px;
}

(代码)

<div id="lg-5">< /div>
<div id="lg-3" class="pic">
<img src="images/1.jpg">
</div>

有什么想法吗？

谢谢

Answer 1

问题来自 .pic 类，因为您使用的是 IE 不支持的 css3 属性 display: initial;。

更确切地说，在样式表 formate.css 中，行 390 具有以下规则:

.pic {
    display: none;
}

然后，在 395 行，此规则在媒体查询中被覆盖，方法是:

@media (min-width: 500px) {
    .pic {
        display: initial;
    }
}

IE 和其他不兼容 CSS3 的浏览器不支持它。

所以我的建议是使用display: block;，像这样:

@media (min-width: 500px) {
    .pic{
        display: block;
    }
    ....
}

您可以在此处阅读有关此 css display: initial; 属性的更多信息: https://developer.mozilla.org/en-US/docs/Web/CSS/initial