Question

我有一个有许多图像的画廊。它们具有设定的宽度，并且没有图像的高度，并且高度显然正好是图像，因此一个可以是500px的高度，而下一个可以是620px的高度。

这是css：

.mygallery { width: 650px; padding:0; margin:0; }

我有一个标题需要直接在图像下方，而css就是：

#category span{color:#FFFFFF;}

任何人都可以帮助我如何将类别范围放在我的画廊下面。我只是无法让它在下面。显然，如果所有的图像都是相同的高度会很好，但是因为它们都是不同的，所以证明它很难。

感谢您的帮助。

Answer 1

HTML中图像的自然结构将是这样的：

<figure>
  <img>
  <figcaption></figcaption>
</figure>

可以将figure元素设为inline-block（如果要在一行中列出多个元素），其余元素通常显示为blocks。这种结构应该可以做你想要的。 span必须被告知或被告知显示为block元素 - 这是问题的一部分。