Как отрегулировать загрузочную карусель по высоте? - PullRequest
0 голосов
/ 15 февраля 2019

Это мой веб-сайт: https://pcshiraz.ir
Моя высота изображения карусели не отвечает, я не могу найти решение.

Ответы [ 5 ]

0 голосов
/ 15 февраля 2019

Привет, вы можете добавить это Таблица стилей Я пробовал на вашем веб-сайте с элементом inspect, он работал !

/* Medium devices (landscape tablets, 768px and up) */
@media only screen and (min-width: 768px) and (max-width: 991px) {
  .carousel-inner {
    height: 400px;
}

.carousel-item, .carousel-item img {
    height: 400px;
  width:100%;
}

} 

/* Extra small devices (phones, 600px and down) */
@media only screen and (max-width: 767px) {
    .carousel-inner {
    height: 160px;
}

.carousel-item, .carousel-item img {
    height: 160px;
  width:100%
}
}

Вот результат

enter image description here

0 голосов
/ 15 февраля 2019

Просто добавьте ширину: 100% на ваш слайд <img /> тег.Если вы используете загрузчик, используйте класс w-100 или что-то в этом роде.Но имейте в виду, что SEO пинает вас в задницу за такое сжатие изображений, вы можете использовать несколько изображений и отображать их в зависимости от размера экрана.

0 голосов
/ 15 февраля 2019

Вам нужно использовать

.carousel {
   min-height: auto;
}

или попробовать использовать

.carousel {
   min-height: 100%;
}
0 голосов
/ 15 февраля 2019

Попробуйте использовать viewheight,

.carousel{
    min-height: 100vh;
    height: 100vh;
}

Viewheight занимает% от экрана.50vh означает, что он займет 50% вашего дисплея.100vh займет 100% вашего дисплея.

0 голосов
/ 15 февраля 2019

Вы не можете решить проблему с активным карусельным элементом.Вы можете попробовать col-md-6 или col-sm-12 вместо активного элемента карусели.Таким образом, высота будет автоматически изменена.

...