HTML多图片对齐

我想在网页上显示一些图片。我希望它们与一些位于它们上方的文本配对。我有一个最大宽度为640像素的中心部分的所有内容。我想要的是让这些图片（以及它们成对的文本）彼此相邻，除非窗口缩小到小于它们的宽度

最大宽度（640px+）：

或者如果缩小（小于两个图像宽度）：

编辑： 我是html/css新手。我不想在网站上发布我的代码，所以我为我的缺乏道歉

我只是想让照片保持原样大小。当宽度可以支撑时，并排坐着。但我的最大宽度是640px。

这里有一把小提琴：

如果没有自己的代码，这不是很清楚，但是您可以使用我的示例

@media all and (max-width:650px) {
    .imagebox {width:100%}
}
}

这种方法：

窗口缩小到小于其宽度

在一个反应迅速的环境中是没有意义的。如果您希望针对所有宽度对图像进行优化，请查看：

皮卡丘

喷射器

到目前为止您尝试了什么？发布代码以显示您尝试了什么。这非常有用！“窗口缩小到小于其宽度”的评论措辞不恰当。我的意思是如果页面的宽度没有它们的组合宽度那么宽。我不需要调整大小的图像，如果人是在看一些非常小的图像。它们可以左右滚动。我只是不喜欢当前的设置，它们垂直对齐，即使它们可以很容易地并排放置。我更改了喷射器，您可以在div中添加text align:center，也可以将文本居中。或者你可以加上，我想你可以做到

           Pikachu

      IMAGE GOES HERE

           Squirtle

      IMAGE GOES HERE

          Charmander

      IMAGE GOES HERE

          Bulbasaur

      IMAGE GOES HERE

@media all and (max-width:650px) {
    .imagebox {width:100%}
}
}

<div style="width:100%; clear:both; max-width:650px;">
<div style="float:left; width:45%;">
Pikachu<br>
<img src="pikachu.png">
</div>

<div style="float:left; width:45%;">
Squirtle<br>
<img src="squirtle.png">
</div>
</div>