Question

我有一个页面显示图像，图像真的搞砸了:) 这就是页面的样子：

http://www.comehike.com/outdoors/parks/park.php?park_id=15

在右侧中间看到图像看起来非常凌乱。当我尝试查看源代码时，下面的html就是我得到的。但仅从它看，它看起来合理 - 不是吗？

<a href="http://www.comehike.com/hikes/hike_image.php?hike_photo_id=&photo_path=http://www.comehike.com/img/hiking_photos/108_101/full_DSC_2822.JPG"><img src="http://www.comehike.com/img/hiking_photos/108_101/small_DSC_2822.JPG" style="border: none;" /></a>

Answer 1

我看到两个问题。一个是，一些图像链接被破坏，因此每个其他图像都没有加载。第二个是，图像包含在具有明确尺寸的div中，并且内容不适合div内部，并且它们在下面内容的顶部流出。

您可以将'overflow'css属性设置为auto，它将添加滚动条，或者您可以删除显式的height属性并使其余的布局流程（可能是首选）。

Answer 2

A）。使用<img>的宽度和高度属性 B）。你可能需要增加这些图像所在的<div>的高度或将其设置为style="min-height: 50px";

Answer 3

你的一些图片有一个空的src：

<a href="http://www.comehike.com/hikes/hike_image.php?hike_photo_id=&photo_path=http://www.comehike.com/img/hiking_photos/108_2/cannon3.jpg">
  <img src="" style="border: none;" />
</a>

这个img html标记怎么了？

3 个答案: