如何添加適合HTML5 Bootstrap/Boilerplate Fluid容器的DIV？

Question

我剛開始使用bootstrap，我覺得它很棒。但我很難弄清楚如何在bootstrap的基本容器周圍添加一個包裝。

我使用Fluid響應css，它很好地將.container中的元素居中。

但我的整個頁面作爲一個整體有一個背景，我想爲實際內容的區域不同的背景（其中容器）

所以基本上我有例如

<div id="wrapper-page" style="background-color:grey; ";> 
<div id="wrapper-content" style="background-color:#93C;> 

    <div class="container">Header Contents here </div> 
    <div class="container">Body Contents here </div> 
    <div class="container">Footer Contents here </div> 

</div> 
</div> 
</div> 

是有一個簡單的方法來實現我所需要的？

其實我可以很容易地修改bootstrap.css文件來樣實現我想要什麼，但我真的想保持輕鬆升級模板/框架之外我修改後

Answer 1

你爲什麼不使wrapper-content也是引導程序.container？嘗試了這一點之前

<div id="wrapper-page" style="background-color:grey; " ;=""> 
<div id="wrapper-content" class="container" style="background-color:#93C;"> 

    <div class="container">Header Contents here </div> 
    <div class="container">Body Contents here </div> 
    <div class="container">Footer Contents here </div> 

</div> 
</div> 

Demo