Html 有没有办法将jumbotron中图像的高度限制为jumbotron的高度？

我不确定这个问题是否足够清楚，也许浏览一下网站会有所帮助

我希望在调整屏幕大小时（或在较小屏幕设备上观看时，例如：智能手机），右侧三辆车的图像保持在与jumbotron相同的高度。我该怎么做

目前，这是我为网站的该部分准备的html：

<div class="jumbotron text-left">
  <h1>Liverpool Vehicle Hire</h1> 
  <p>The one stop shop for all your private hire needs <br> in the Sefton &amp; Liverpool areas.</p>
  <img src="header.png" height="357px" align="right" style="position:absolute; top: 30px; right:0px; z-index:0">
</div>

利物浦租车公司
Sefton&；为您的所有私人租赁需求提供一站式服务；利物浦地区

实现这一点的最简单方法是设置

溢出：隐藏.jumbotron

元素上的code>属性

由于您的汽车图像使用的是

位置：绝对

，您还必须为

.jumbotron

元素指定一个

位置：相对以锚定图像

只需将其添加到CSS中：

.jumbotron {
  overflow: hidden;
  position: relative;
}

编辑

当我在你的网站上使用firebug测试时，它工作得非常好，但是如果你在测试之后还想调整它，你可以添加以下内容：

.jumbotron > img {
  height:100%;
}

由于
位置：相对锚定图像这将强制图像高度进入
.jumbotron
高度。
你好！谢谢你这么快的回复。我现在就试试看！当然可以我添加了一个带有额外可选调整的编辑，以备您需要。这会迫使img始终填充jumbotron的高度吗？如果是这样，那可能会好得多。是的，但前提是你已经给出了
.jumbotron
a
位置：相对，在这个例子中溢出更多的是一个安全网：）回答得好。一定要对这个问题投赞成票；-）