Bootstrap jumbotron可更改较小屏幕的高度

Question

简单的引导程序jumbotron。。。

.jumbotron-page {
height:300px;
}

在移动/小型设备上，我需要将高度更改为100px，所以我得到了这个。。。

.jumbotron-page {
height:100px;
}

我就是无法让我的媒体查询正确地实现这一点。感谢您的帮助。

Answer 1

假设您的移动设备的屏幕大小小于~700px

包括以下元数据：

<meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1"/>

和媒体查询：

@media all and (max-width: 700px)
{
    .jumbotron-page
    {
        height: 100px;
    }
}