Twitter bootstrap 引导程序3：将响应分为不同的行

我目前正试图在Bootstrap3.2中实现以下布局，但我真的不知道如何实现

桌面布局md：

--------------------------------------------
| text1                       |            |
-------------------------------    abc     |
|  text2        |    text3    |    def     |
|               |             |            |
--------------------------------------------

移动布局xs：

--------------------------------------------
| text1                                    |
-------------------------------------------|
|             text2           |            |
------------------------------|    abc     |
|             text3           |    def     |
|                             |            |
--------------------------------------------

---

你知道如何做到这一点吗？基本上，我必须用两列进入第二行，我想…

您可以使用两个右菜单并隐藏其中一个

演示

---

那么sm呢？太棒了，这就成功了。我希望这是可能的，没有重复的内容，但这就像一个魅力工程。谢谢您也可以在手机上使用其他版本的功能表。

<div class="container">
    <div class="row">
        <div class="col-md-9">
            <div class="row">
                <div class="col-xs-12 bg-primary ">
                    text1
                </div>
            </div>
            <div class="row">
                <div class="col-xs-9 col-md-12">
                    <div class="row">
                        <div class="col-xs-12 col-md-6 bg-warning">text2</div>
                        <div class="col-xs-12 col-md-6 bg-success">text3</div>
                    </div>            
                </div>
                <div class="col-xs-3 bg-danger hidden-md hidden-lg">
                    abc<br/>
                    def
                </div>
            </div>
        </div>
        <div class="col-md-3 bg-danger hidden-xs hidden-sm">
            abc<br/>
            def
        </div>
    </div>
</div>