css - 图像随窗口宽度调整大小，但保持比例

Question

您好，我正在研究图像 slider 。我需要一个图像来调整其 div 的高度(这几乎是窗口的大小)。现在，图像具有此 css:

.carousel-inner > .item >img {
    height:100%;
  width:auto;
}

我也试过 width:100%。例如，如果我只使窗口在水平方向上变窄(窗口高度不变)，则图像本身不应改变大小，而只是将其边裁剪掉。但是，如果我使窗口在垂直方向上更窄(降低窗口高度)，图像将根据高度调整大小。

抱歉，如果不清楚。有什么想法吗？

Answer 1

试试背景大小:

.carousel-inner > .item {
     background-image: url('../../..');
     background-size: cover;
}