我有一个网站，它使用 JSON 对象数组列出数据库中的事件。每个事件都有一堆图像，其中一些图像与其他图像大小不同。这使得事件不能很好地排列在每行 3 个事件的矩阵中，其中只有主图像是可见的，但它们的大小不同。我尝试制作一个最大高度 div 并将其包裹在图像周围，以便它放置空白，以便每个事件框保持与其他事件框相同的大小，但是当我缩小超过浏览器中的某个点时，这会破坏我的整个页面，因为所有当图像变得太大并覆盖它们时，它下面的相对 div 不会移动。我如何处理不同大小的响应图像的情况，但希望保持它们都具有相同相对高度的容器 div，该容器 div 随着放大和缩小而缩放(理想情况下不水平拉伸(stretch)图像)？
<div style="max-height:265px; min-height: 265px;">
<img class="eventImage img-responsive" src="{{event.image}}" alt="{{event.name}}"/>
</div
最佳答案
不确定这是否有帮助，但可能是您可以研究的内容，它可能会有所帮助! https://www.w3schools.com/howto/howto_js_lightbox.asp有不同的样式，所以可能是您正在寻找的样式。希望这有帮助
关于html - 各种尺寸和 img 响应的图像 - 如何设置响应式 div？，我们在Stack Overflow上找到一个类似的问题： https://stackoverflow.com/questions/42585351/