Bootstrap carousel увеличить изображение снизу

Question

Bootstrap carousel увеличить изображение снизу

0

Я использую карусель Bootstrap на веб-сайте, который является полной шириной экрана с отзывчивой высотой. Проблема в том, что из-за характера изображений я хотел бы, чтобы изображения были выровнены по дну.item div и расширялись снизу, а не сверху слева, как обычно. Можно ли это сделать в CSS или это можно сделать только в JS?

Вы можете посетить веб - сайт и коды здесь.

TomRichardson 09 апр. 2014, в 22:27

Источник

Теги:

html

css3

image

twitter-bootstrap-3

carousel

1 ответ

Ещё вопросы

morkro · Answer 1 · 2014-04-09T18-25-00.000Z

Вы можете просто установить bottom: 145% к img -tag и переместить его в начало обертки .item -class. Для .item,.carousel-inner,.carousel -class es потребуется height исправления -property, чтобы заставить ее работать.

Как это:

.carousel, .carousel-inner, .item {
   height:100%;
   max-height:600px;
}
.carousel-inner > .item > img, 
.carousel-inner > .item > a > img {
   position: relative;
   bottom: 145%;
}

Просто поиграйте со своим имуществом, чтобы найти лучшую позицию.

Добавив, что это не смещает изображение в любом случае для меня
Хорошо, извините, я пропустил некоторые части. Вы должны добавить height: 600px к .item и .carousel-inner . Потому что элементам нужна фиксированная высота. Я обновлю свой ответ.
Я не хочу, чтобы изображения имели фиксированную высоту, поскольку я хочу, чтобы они настраивались для разных размеров окна и экрана.
По-прежнему не очень хорошо работает для меня, так как когда вы уменьшаете размер окна, и все изображение необходимо просматривать, в нижней части есть зазор