如何使自舉一個小容器

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">