图片无法显示 - CSS

Question

我对移动/桌面设备的CSS错误有一个奇怪的问题。

在移动设备上，我的某个课程的图片不会显示，但其内容区域会显示。

在桌面上，我的某个课程的图片会显示，包括其内容区域。

这就是我创建图片的方式：

<div class="image">
<img src="images/image.jpg" alt="" />
</div>

这就是我在我的mobile.css文件中所做的事情：

.image {

width: 471px;
height: 513px;
float: left;
}

在我的另一个文件中（对于iPhone）我没有显示图像所以我这样做：

.image {
   display: none;
}

这会导致我的问题吗？

Answer 1

@media screen and (max-width: 480px) {
  .image {
    display : none;
  }
}

Answer 2

最近我自己遇到这个问题，原因是图像文件太大（文件大小，而不是维度）。尝试使文件类型更小，然后最终加载。试试site like this来帮助你。

Answer 3

如果出于某种原因在其他情况下应用display: none;规则，是的。删除此规则，然后重试。每当发生奇怪的事情时，我会逐个删除代码块，以查看导致问题的原因。所有编辑都有撤消，所以我删除一个块，测试和撤消，删除下一​​个块等。