Twitter bootstrap 如何为moblie、tablet和desktop划分12列引导div

我不熟悉引导。我正在尝试设计一个具有不等列的div。我希望所有列在桌面上水平显示，我希望在移动设备和平板电脑上连续显示2或3列。我是为桌面设计的。但我无法为xs和sm设计

请在下面找到我的代码：

<div class="container">

        <div class="row" style="padding-top:10px;padding-left:10px;">
            <div class="col-xs-2 ">

                cola
            </div>
            <div class="col-xs-2 ">
              colb
            </div>

            <div class="col-xs-2">
             colc

            </div>


            <div class="col-xs-3 ">
               cole
            </div>

            <div class="col-xs-3 ">
              colf

            </div>
        </div>
        <div class="row" style="padding-top: 20px; padding-left: 10px;">
            <div class=" col-xs-2">
               cola
            </div>
            <div class="col-xs-2">
              colb
            </div>

            <div class="col-xs-2">

                colc
            </div>

            <div class="col-xs-2">
               cold 
            </div>
            <div class="col-xs-2" style="display:inline-block">
               cole
            </div>

            <div class="col-xs-2" style="display:inline-block">
       colf
            </div>


        </div>
        <div class="row" style="padding-top: 20px; padding-left: 10px;">
            <div class="col-xs-2">
               cola
            </div>
            <div class="col-xs-2">
              colb
            </div>

            <div class="col-xs-2">
               colc
            </div>

            <div class="col-xs-6">
               cole

            </div>


        </div>

</div>
enter code here

可乐
马驹
可乐
科尔
科尔夫
可乐
马驹
可乐
冷的
科尔
科尔夫
可乐
马驹
可乐
科尔
在这里输入代码

我在每一列中都有图像和文本，在手机和平板电脑中，图像和文本重叠

---

请提供帮助。

您所要做的就是为手机、平板电脑和桌面应用不同的类 像这样的

<div class="container">
  <div class="row">
    <div class="col-xs-6 col-sm-4 col-md-12">

    </div>

    <div class="col-xs-6 col-sm-4 col-md-12">

    </div>
  </div><!-- .row -->
</div><!-- .container -->

所以你会有 移动设备（col-xs-6和col-xs-6）上的1行2列 1排，片剂上有3个col（col-sm-4和col-sm-4）

---

和桌面上的两行（col-md-12和col-md-12）

如果您希望在桌面上折叠列，请使用col-md-12。