Bootstrap 4 如何处理不同屏幕尺寸的列排序？

Bootstrap4 中的列排序

为了在不同屏幕尺寸上灵活排列列，Bootstrap 提供了一系列选项。

响应式排序在引导程序中4.0:

Bootstrap 4 消除了对其响应式排序类使用“xs-”前缀。相反，“push-”和“pull-”修饰符指定视口和移动列的单位数。例如，要在移动设备上实现所需的 1-3-2 顺序：

<div>

Bootstrap 4.1 及更高版本中的响应式排序:

Bootstrap 4.1 引入了 Flexbox，简化列排序。订单类别范围从“order-1”到“order-12”。列可以响应式排序，例如“order-md-12 order-2”（MD 上最后一个，XS 上第二个）：

<div>

替代排序方法:

除了响应式排序类之外，flexbox 方向实用程序还提供了另一种方法：

<div>

附加说明：

• 列排序是相对于其父.row。
• 响应类允许精细控制over order，实现跨多种屏幕尺寸的复杂排列。
• Bootstrap 4.1及以上版本不再支持4.0之前版本中使用的push/pull类。

以上是Bootstrap 4 如何处理不同屏幕尺寸的列排序？的详细内容。更多信息请关注PHP中文网其他相关文章！