Html 三个12列网格并排使用twitter引导

我正在使用bootstrap创建一个个人网站，我想创建以下特定布局：

每个部分的宽度为940 px，共有12列，因此当屏幕显示3个部分中的1个部分时，其他2个部分被隐藏，我如何执行此操作

---

非常感谢你的帮助

给定默认的12列引导网格，使用以下标记：

<div class="container supercontainer">
    <div class="supercontainer-inner clearfix view-1">
        <div class="container"><div class="row"><div class="span12"><p>Grid 1</p></div></div></div>
        <div class="container"><div class="row"><div class="span12"><p>Grid 2</p></div></div></div>
        <div class="container"><div class="row"><div class="span12"><p>Grid 3</p></div></div></div>
    </div>
</div>

请记住，使用carousel样式表可以获得更好的效果

选中“查看一个可能的应用程序以切换视图”

---

这是一个反应灵敏的版本

但这将需要一些清理，以减少脚本，并使用一个用于视图数量的变量（可能只是扩展基本网格..哼）

@介质（最小宽度：1200px）{
.supercontainer-inner.view-1{左边距：0；}
.supercontainer-inner.view-2{左边距：-1170px；}
.supercontainer-inner.view-3{左边距：-2340px；}
.超级集装箱内部{
宽度：3510px；
}
}
@介质（最大宽度：979px）{
.supercontainer-inner.view-1{左边距：0；}
.supercontainer-inner.view-2{左边距：-724px；}
.supercontainer-inner.view-3{左边距：-1448px；}
.超级集装箱内部{
宽度：2172px；
}
}
@介质（最大宽度：767px）{
.supercontainer-inner.view-1{左边距：0；}
.supercontainer-inner.view-2{左边距：-100%；}
.supercontainer-inner.view-3{左边距：-200%；}
.超级集装箱内部{
宽度：300%；
}
.supercontainer internal>.container{宽度：33.33%！重要；}
}

给定默认的12列引导网格，带有以下标记：

<div class="container supercontainer">
    <div class="supercontainer-inner clearfix view-1">
        <div class="container"><div class="row"><div class="span12"><p>Grid 1</p></div></div></div>
        <div class="container"><div class="row"><div class="span12"><p>Grid 2</p></div></div></div>
        <div class="container"><div class="row"><div class="span12"><p>Grid 3</p></div></div></div>
    </div>
</div>

请记住，使用carousel样式表可以获得更好的效果

选中“查看一个可能的应用程序以切换视图”

---

这是一个反应灵敏的版本

但这将需要一些清理，以减少脚本，并使用一个用于视图数量的变量（可能只是扩展基本网格..哼）

@介质（最小宽度：1200px）{
.supercontainer-inner.view-1{左边距：0；}
.supercontainer-inner.view-2{左边距：-1170px；}
.supercontainer-inner.view-3{左边距：-2340px；}
.超级集装箱内部{
宽度：3510px；
}
}
@介质（最大宽度：979px）{
.supercontainer-inner.view-1{左边距：0；}
.supercontainer-inner.view-2{左边距：-724px；}
.supercontainer-inner.view-3{左边距：-1448px；}
.超级集装箱内部{
宽度：2172px；
}
}
@介质（最大宽度：767px）{
.supercontainer-inner.view-1{左边距：0；}
.supercontainer-inner.view-2{左边距：-100%；}
.supercontainer-inner.view-3{左边距：-200%；}
.超级集装箱内部{
宽度：300%；
}
.supercontainer internal>.container{宽度：33.33%！重要；}
}

您是否打算使用JS更改视图？如果是这样的话，你有没有想过使用默认网格，只是隐藏或显示你想要的网格？你打算使用JS来改变你的视图吗？如果是这样的话，你有没有想过使用默认网格，只需隐藏或显示你想要的网格？非常感谢sherbrow！这正是我要找的！谢谢：谢谢你，谢谢你！这正是我要找的！谢谢：D