所有图片都缩放

Question

我网站上的所有图片都在放大，我无法弄清楚它在代码中的位置。我index页面上的第二张幻灯片与此页面相同：

，但是我的腿被切割等等。一般来说，我的所有页面上的图片都是这样做的。有没有人知道哪里可以通过检查窗口？我不太确定javascript是否控制了一些这个？

另一个例子是page，横幅上有min-height: 350px;。原始图片看起来像这样，应该符合横幅的大小：

这是索引页面上横幅的CSS：

slider-banner-container,
.slider-revolution-5-container {
  width: 100%;
  position: relative;
  padding: 0;
}

.slider-banner-fullscreen,
.slider-banner-fullwidth {
  width: 100%;
  position: relative;
}

.slider-banner-container ul.slides,
.slider-revolution-5-container ul.slides {
  display: none;
}

/*Spinner*/
.tp-loader.spinner2 {
  background-color: #999;
}

/*Captions*/
.tp-caption {
  z-index: 5;
}

.tp-caption a,
.tp-caption a:hover {
  color: #ffffff;
}

.tp-caption a.btn-gray,
.tp-caption a.btn-gray:hover {
  color: #333333;
}

.caption-box {
  max-width: 540px;
  color: #ffffff;
  white-space: normal;
  padding: 20px;
  border: none;
}

.caption-box h2 {
  color: #ffffff;
}

/*text rotator*/
.tp-caption .text-rotator {
  min-width: 580px;
  display: inline-block;
}

.light-translucent-bg.caption-box h2,
.light-translucent-bg.caption-box p {
  color: #333333;
  font-weight: 400;
}

.caption-box:after {
  z-index: -1;
}

.slideshow .dark-translucent-bg:not(.caption-box),
.slideshow .light-translucent-bg:not(.caption-box) {
  border-top: none;
  border-bottom: none;
  position: absolute;
  left: 0;
  top: 0 !important;
  width: 100%;
  height: 100%;
}

祝大家圣诞快乐。

Answer 1

您的滑块可以正常工作。调整屏幕大小，您会发现您将看到一些尺寸的整个图像。获得像ovokuro建议的不同图像。 对于第二个图像，您要查找的是限制高度的最小高度。尝试增加尺寸并按下图像。

.banner.parallax, .banner.light-translucent-bg, .banner.dark-translucent-bg, .banner.default-translucent-bg {
    min-height: 350px;
    padding-top: 60px;
    padding-bottom: 20px;
}

Answer 2

试试这个：

.imageClass { object-fit: cover; }

这应该使图片适合横幅。

Answer 3

使用CSS属性＆＃34; background-size：contains;＆＃34;如果你想在幻灯片的包装中完整显示图像

.img-class{
    background-image: url(/images/banner1-desktop.jpg);
    background-size: contain;
}