爲什麼不使用我的瀏覽器的整個寬度引導設備寬度？

我試圖按照Bootstrap教程，但我創建的第一個div應該跨越我的瀏覽器/設備的整個寬度，似乎被限制在〜1000像素。任何想法，爲什麼這是？爲什麼不使用我的瀏覽器的整個寬度引導設備寬度？

這裏是我的代碼：

<!doctype html> 
<html lang="en"> 
<head> 
    <meta charset="UTF-8"> 
    <title>Testing the Bootstrap 3.0 Grid System</title> 
    <meta name="viewport" content="width=device-width, initial-scale=1.0"> 
    <!-- Bootstrap --> 
    <link href="css/bootstrap.min.css" rel="stylesheet" media="screen"> 
    <style> 
    .col-xs-12 { 
     height: 100px; 
     background-color: blue; 
     color:white; 
     text-align: center; 
    } 
    </style> 
</head> 
<body> 
    <div class="container"> 
    <div class="row"> 
     <div class="col-xs-12">.col-xs-12</div> 
    </div> 
</div> 

</body> 
</html>

預先感謝任何幫助。

來源

2014-02-25 Tim

使用'.container-fluid'而不是'.container'。 – davidpauljunior

如果您正在使用最新的3.1，可以使用container-fluid類代替container這樣的..

<div class="container-fluid"> 
    <div class="row"> 
     <div class="col-xs-12">.col-xs-12</div> 
    </div> 
</div>

3.1全寬：http://www.bootply.com/116382

自舉3.0.x的，你會需要使用這樣的定製容器......

.container-full { 
    margin: 0 auto; 
    width: 100%; 
}

3.0全寬：http://www.bootply.com/107715

來源

2014-02-25 02:51:57 ZimSystem

這樣做（容器液，即），謝謝！限制容器類的寬度有什麼意義？ – Tim

容器類的寬度根據媒體查詢而定。你的內容是在這個div內，所以它的寬度是基於它的。

您可以在所有主流瀏覽器的開發工具中查看該內容，找到該元素並查看CSS樣式/屬性。

來源

2014-02-25 02:47:08 Brocco

爲什麼不使用我的瀏覽器的整個寬度引導設備寬度？

回答

相關問題