如何使自举一个小容器

Question

林使使用引导嵌套在一个容器中的登录页面

我知道这引导的工作方式是与网格系统根据你的设备的宽度例如，如果在我的Iphone上查看该页面，它会看起来很好，因为我的手机的宽度足够小，以便容器具有可管理的大小。

但是，如果我在桌面或iPad上查看页面，容器的宽度看起来很荒谬，因为输入字段几乎占用了整个页面的宽度。

所以我的问题是我怎么能设置一个宽度到我的容器（或包含登录窗体的面板），而不会弄乱它现在在移动版本上的样子，这是完美的。我知道通过设置手动宽度不起作用，因为它也设置了移动设备上的宽度。有没有简单的方法来做到这一点，我只是没有看到在文档中？

Answer 1

这可能可以帮助您：

@media (min-width: 768px) { 
    .container-small { 
     width: 300px; 
    } 
    .container-large { 
     width: 970px; 
    } 
} 
@media (min-width: 992px) { 
    .container-small { 
     width: 500px; 
    } 
    .container-large { 
     width: 1170px; 
    } 
} 
@media (min-width: 1200px) { 
    .container-small { 
     width: 700px; 
    } 
    .container-large { 
     width: 1500px; 
    } 
} 

.container-small, .container-large { 
    max-width: 100%; 
} 

然后你可以使用的类：容器小和容器大旁边的容器类，像这样<div class="container container-small">