如何根据图像大小在两个容器之间切换？CCC/HTML

谁能告诉我如何根据图像的大小在两个img容器之间切换

目前，我有一个标准的图像容器，在标准网格中显示IMG

CSS

.rounded-image {
width: 100%;
height: auto;
webkit-border-radius: 4px 4px 4px 4px;
-moz-border-radius: 4px 4px 4px 4px;
border-radius: 4px 4px 4px 4px;
}

HTML

<td align="center" bgcolor="#FFFFFF"><a href="http://*URL*/products/<?  =$cake['id']?>-1.jpg" rel="lightbox[<?=$cake['name_p']?>]"><img   src="http://*URL*/products/<?=$cake['id']?>-1.jpg" alt="<?=$cake['name']?>"   class="rounded-image" /></a></td>

*注意，上面的URL已被混淆

我有各种不同的图像大小贯穿整个网站-一些地方的宽度大于高度，反之亦然。目前，“横向”图像的显示与容器不成比例。图像似乎被压扁了

我在想，有两个容器适合纵向或横向IMG是明智的。我只是不完全确定如何在两者之间切换

任何帮助都将不胜感激

谢谢

---

编辑的

你不能给图像添加CSS样式吗？圆形图像img{width:100%；height:auto；}我无法想象容器会有什么不同？你能提供一个视觉效果吗？@СъПГППППииъъъиъъъъъъъъъъ。它使其中一张图片比其他图片小。知道我哪里出错了吗？我明白了，你为什么不尝试使用jQuery插件，它可以像砖石或同位素一样布局“Pinterest风格”的图片，这样无论图片的高度如何，它们都可以排列。或者，您也可以向容器添加样式。圆形图像{min heigh:？？？px}将确保容器的高度最小，从而使其像素数量相同。@СъПГППППППииииииииииииииииииииииииииииииииии。谢谢