Bootstrap网格的第一列分为两行，第二列与之相邻

Question

">"        col1             col2      
">"   |--------------|---------------|
">"   |   text1      |               | 
">"   |--------------|  navigation   | 
">"   |    text2     |               |
">"   |--------------|---------------|

我需要创建如上图所示的网格来保存文本和导航菜单。到目前为止，我尝试使用行和跨度的不同变化。这个想法是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>`

Answer 1

这将为您提供帮助。链接

我加了，background-color这样您就可以看到了divs。