Twitter Bootstrap - 在lg設備上使用「容器流體」的語義方式

Question

假設我有一個應用「容器流體」的div。

當視口低於1200像素（大型設備）時，如何將其更改爲「容器」？

我知道，我可以複製的代碼，並使用這樣的：

<div class="container-fluid hidden-md">...content here...</div> 
<div class="container hidden-lg">...content here...</div> 

但這種感覺並不好。有沒有其他方法可以做到這一點？

Answer 1

你可以自定義類和媒體查詢添加到您自己的樣式表（引導加載後），所以像

.customcontainer { 
 
    border: 1px solid red; 
 
} 
 
@media(max-width:1200px) { 
 
    .customcontainer { 
 
    max-width: 300px; //or whatever you want max width to be 
 
    } 
 
}

<link href="//netdna.bootstrapcdn.com/bootstrap/3.1.1/css/bootstrap.min.css" rel="stylesheet" /> 
 
<div class="container-fluid customcontainer">...content here...</div>

我剛添加的邊框和示範低像素寬度目的