如何使用引导程序将水平 div 更改为垂直，div 顺序更改

Question

我有 4 个div ex.水平方向上的 A、B、C、D 如何使用引导程序在移动视图上显示那些div A、C 下一行然后 B、D。

Answer 1

您可以使用flex排序

下面是示例

ul{
display: flex;
flex-wrap: wrap;
}
ul li{
  width: 100%;
  display: block;
}
ul li:nth-child(1){
  order: 1;
}
ul li:nth-child(2){
  order: 3;
}
ul li:nth-child(3){
	order: 2;
}
ul li:nth-child(4){
	order: 4;
}

<ul>
	<li>A</li>
	<li>B</li>
	<li>C</li>
	<li>D</li>
</ul>

对于移动设备，您可以使用宽度并排或彼此下方显示项目。

Answer 2

col-xs-6 class todivs。阅读官方文档以获取更多信息和断点。

Answer 3

您使用的是 Bootstrap 3 还是 4？

对于 3，您可能想查看推送/拉取类 - https://getbootstrap.com/docs/3.3/css/#grid-column-ordering

在版本 4 中，这被替换为订购 - https://getbootstrap.com/docs/4.0/layout/grid/#reordering