twitter-bootstrap Bootstrap 网格第一列分成两行，第二列与之相邻
声明：本页面是StackOverFlow热门问题的中英对照翻译，遵循CC BY-SA 4.0协议，如果您需要使用它，必须同样遵循CC BY-SA许可，注明原文地址和作者信息，同时你必须将它归于原作者（不是我）：StackOverFlow
原文地址: http://stackoverflow.com/questions/30268831/
Warning: these are provided under cc-by-sa 4.0 license. You are free to use/share it, But you must attribute it to the original authors (not me):
StackOverFlow
Bootstrap grid column one split into two row, column two adjacent to it
提问by cao
">" col1 col2
">" |--------------|---------------|
">" | text1 | |
">" |--------------| navigation |
">" | text2 | |
">" |--------------|---------------|
I need to create grid like the diagram above to hold texts and navigational menu. so far I try different variation using row and span. the idea is col1 split into two and col2 should be next to it. the column on left split in two, column right same height but adjacent to column one.
我需要像上图一样创建网格来保存文本和导航菜单。到目前为止，我尝试使用行和跨度进行不同的变化。这个想法是 col1 一分为二， col2 应该在它旁边。左侧的列分成两部分，右侧的列高度相同但与第一列相邻。
`<div class="row">
<div class="span6">
<div class="row">
<div class="col-sm-6" style="background-color:blue;">AAAA</div>
</div>
<div class="row">
<div class="col-sm-6" style="background-color:red;">BBBB</div>
</div>
</div>
<div class="span6">
<div class="row">
<div class="col-sm-12" style="background-color:yellow;">row2</div>
</div>
</div>
</div>`
回答by CENT1PEDE
回答by Mohammed Abrar Ahmed
This should help
这应该有帮助
<div class="col-md-12">
<div class="col-md-6">
<div class="row-fluid">
<div class="span2">Text 1</div>
<div class="span2">Text 2</div>
</div>
</div>
<div class="col-md-6">
Navigation
</div>
</div>
