Bootstrap carousel adjust height

Question

Я новичок в Bootstrap, и у меня есть вопрос о карусели. Мне нужно установить высоту 700 пикселей на большие экраны (шт.) И высоту 500 пикселей для мобильных телефонов. Как мне это сделать? Я положил это:

@media (min-width: 320px){ 
    .carousel-caption p { 
    margin-bottom: 20px; 
    font-size: 20px; 
    line-height: 1.4; 
    } 
    .carousel { 
    height: 500px; 
    margin-bottom: 60px; 
    } 

    .carousel .item { 
    height: 500px; 
    background-color: #777; 
    } 
    .carousel-inner > .item > img { 
    position: absolute; 
    top: 0; 
    left: 0; 
    min-width: 100%; 
    height: 500px; 
    } 

} 

Жду ответа.

Спасибо!

Answer 1

Я не могу проверить его правильно знать, но если вы хотите иметь высоту 500 пикселей в устройствах с шириной меньше 320 пикселей, вы должны запросить медиа-запрос @media (max-height:320px) вместо @media (min-width:320px).

EDIT:

Я проверил это и так работает:

@media (max-width:320px){ 
    .carousel{ 
    height:50px; 
    } 
} 

таким образом из резолюций, которые имеют ширину от 0 до 320, то .carousel класса будет иметь 50px высоту.

Если это решит вашу проблему, не забудьте проголосовать и выберите этот ответ :)