完整和盒裝寬度與Bootstrap 3

-1

我要建立一個2佈局的網站：boxst和全寬by Bootstrap 3.作爲引導文檔，我可以使用.container-fluid創建全寬佈局，是不是？另外，我想知道創建盒裝寬度佈局的方式。預先感謝。對不起英語不好。完整和盒裝寬度與Bootstrap 3

來源

2014-10-28 The Hung

[容器流體VS .container]（http://stackoverflow.com/questions/22262311/container-fluid-vs-container） – ncksllvn 2014-10-28 17:04:30

使用'.container'爲固定寬度的佈局可能重複該僅在屏幕尺寸斷點（XS，SM，MD，LG）上更改寬度。 – cvrebert 2014-10-28 17:46:46

將.container用於響應固定寬度的容器。

<div class="container"> 
    ... 
</div>

將.container-fluid用於全寬度容器，跨越視口的整個寬度。

<div class="container-fluid"> 
    ... 
</div>

爲什麼要downvote？這是真的！！

http://getbootstrap.com/css/

來源

2014-10-28 16:26:11 Refilon

這聽起來像他想要一個插頁。（盒裝內容）更具適應性而不是響應性。 ;） – 2015-01-06 23:57:34

這聽起來像你指的是要帶您在使用媒體查詢指定容器寬度的解決方案。

像這樣的東西應該爲你工作所追求的：

/* Customize container */ 
@media (min-width: 960px) { 
    .container { 
     max-width: 780px; 
    } 
}

以上適用於你是否希望頁面響應（液）。如果您添加上述內容並從其頁面添加默認模板，您應該會看到不同之處。希望這可以幫助。

<!DOCTYPE html> 
<html lang="en"> 
    <head> 
    <meta charset="utf-8"> 
    <meta http-equiv="X-UA-Compatible" content="IE=edge"> 
    <meta name="viewport" content="width=device-width, initial-scale=1"> 
    <title>Bootstrap 101 Template</title> 

    <!-- Bootstrap --> 
    <link href="css/bootstrap.min.css" rel="stylesheet"> 

    <!-- HTML5 shim and Respond.js for IE8 support of HTML5 elements and media queries --> 
    <!-- WARNING: Respond.js doesn't work if you view the page via file:// --> 
    <!--[if lt IE 9]> 
     <script src="https://oss.maxcdn.com/html5shiv/3.7.2/html5shiv.min.js"></script> 
     <script src="https://oss.maxcdn.com/respond/1.4.2/respond.min.js"></script> 
    <![endif]--> 
    </head> 
    <body> 
    <h1>Hello, world!</h1> 

    <!-- jQuery (necessary for Bootstrap's JavaScript plugins) --> 
    <script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.1/jquery.min.js"></script> 
    <!-- Include all compiled plugins (below), or include individual files as needed --> 
    <script src="js/bootstrap.min.js"></script> 
    </body> 
</html>

來源

2015-01-06 23:55:59

嗨@ brian-mallett謝謝你，我會檢查你的建議：D – 2015-01-07 17:40:26

只需添加一個觸摸... @Dennis對使用.container類是正確的。默認情況下，引導包含「理想」大小的媒體查詢中斷。但是，如果您想要完成特定的外觀或感受自己的決定休息時間，則需要用自己的媒體查詢覆蓋它們。 – 2015-01-07 17:50:15

完整和盒裝寬度與Bootstrap 3

回答

相關問題