html - 在 Twiiter Bootstrap 3 中以 8/4 配置水平显示 4 列的内容

Question

我有一个测试页面，其中有一个容器，其中有两列采用 8/4 配置。我想要的是当视口(viewport)缩小时，4 连续滑动到 8 个下方，而不是一列。

所以我正在寻找的是右侧的列在大视口(viewport)中垂直显示，在中间视口(viewport)中水平显示。

这是前后对比图，下面是代码:

    <div class="container">
    <div class="row clearfix">
        <div class="col-md-8 column">
            <div class="row clearfix">
                <div class="col-md-4 col-sm-6 column">
                    <p>
                        Ad simul sensibus per, vel brute summo an, eam harum viderer definiebas ne. Falli
                        graeco sea cu. Est dolores lobortis omittantur ei, exerci scriptorem no vim. Diam
                        tamquam adolescens est id, partem eleifend in pro.</p>
                </div>
                <div class="col-md-4 col-sm-6 column">
                    <p>
                        Ad simul sensibus per, vel brute summo an, eam harum viderer definiebas ne. Falli
                        graeco sea cu. Est dolores lobortis omittantur ei, exerci scriptorem no vim. Diam
                        tamquam adolescens est id, partem eleifend in pro.</p>
                </div>
                <div class="col-md-4 col-sm-6 column">
                    <p>
                        Ad simul sensibus per, vel brute summo an, eam harum viderer definiebas ne. Falli
                        graeco sea cu. Est dolores lobortis omittantur ei, exerci scriptorem no vim. Diam
                        tamquam adolescens est id, partem eleifend in pro.</p>
                </div>
                <div class="col-md-4 col-sm-6 column">
                    <p>
                        Ad simul sensibus per, vel brute summo an, eam harum viderer definiebas ne. Falli
                        graeco sea cu. Est dolores lobortis omittantur ei, exerci scriptorem no vim. Diam
                        tamquam adolescens est id, partem eleifend in pro.</p>
                </div>
                <div class="col-md-4 col-sm-6 column">
                    <p>
                        Ad simul sensibus per, vel brute summo an, eam harum viderer definiebas ne. Falli
                        graeco sea cu. Est dolores lobortis omittantur ei, exerci scriptorem no vim. Diam
                        tamquam adolescens est id, partem eleifend in pro.</p>
                </div>
                <div class="col-md-4 col-sm-6 column">
                    <p>
                        Ad simul sensibus per, vel brute summo an, eam harum viderer definiebas ne. Falli
                        graeco sea cu. Est dolores lobortis omittantur ei, exerci scriptorem no vim. Diam
                        tamquam adolescens est id, partem eleifend in pro.</p>
                </div>
            </div>
        </div>
        <div class="col-md-4 column">

            <div>
                <p>
                    R2 Ad simul sensibus per, vel brute summo an, eam harum viderer definiebas ne. Falli
                    graeco sea cu. Est dolores lobortis omittantur ei, exerci scriptorem no vim. Diam
                    tamquam adolescens est id, partem eleifend in pro.</p>
            </div>
            <br />
            <div>
                <p>
                    R3 Ad simul sensibus per, vel brute summo an, eam harum viderer definiebas ne. Falli
                    graeco sea cu. Est dolores lobortis omittantur ei, exerci scriptorem no vim. Diam
                    tamquam adolescens est id, partem eleifend in pro.</p>
            </div>
        </div>
    </div>
</div>

Answer 1

在“div class=col-md-4”(右列)之后有“div class=row clearfix”，然后是“div class=col-lg-12 column col-md-12 column col-sm- 4列”

第一个和第二个说“当视口(viewport)大时显示为垂直列”第三个说“当视口(viewport)小时显示为水平列(一行)”

感谢 Fabio 让我理解了这些类(class)的实际含义。