Bootstrap 4 如何在不同的屏幕大小上设置特定的填充/边距规则？

我有以下代码：

<div className="col-lg-6 text-lg-left mt-lg-0 col-md-12 mt-md-3 text-md-center" />

在大屏幕设备上，我希望div文本向左对齐，没有页边空白

在中等屏幕设备上，我希望col为全宽，顶部边距为3rem，并居中。这非常有效，但是，对于小屏幕尺寸，我还希望我对中等屏幕尺寸和xs屏幕尺寸的规则保持不变。然而，事实并非如此

所以我试了一下：

<div className="col-lg-6 text-lg-left mt-lg-0 col-md-12 mt-md-3 text-md-center col-sm-12 mt-sm-3 text-sm-center" />

我以为这会奏效，但事实并非如此。我不确定我做错了什么。我看了文档，在文档中可以使用它们的是sm和xs类，但在那些较小屏幕的设备上不起作用

所以我的问题是，如何将我在中屏幕设备上的规则坚持到小型和xs类？我不想编写定制的媒体查询，我只想尝试和坚持引导框架

---

谢谢，

作为经验法则，总是为较小的断点定义规则，因为它们会自动转移到较大的断点

因此，为超小（

xs

）屏幕定义的规则一直应用到大（

lg

）屏幕，直到明确指定为止。因此，如果对

xs

和

sm

有一个特定的设置，那么为

xs

定义，如果对

md

和

lg

有相同的设置，那么为

md

定义它

此外，在引导程序4中，

xs

属性已被删除。因此，引导程序3中的

col-xs-3

变为引导程序4中的

col-3

有关更多信息，请参阅问题

对于您的解决方案，请按如下所示更新

div

你好，世界！

下面是一个相同的代码片段

引导示例
你好，世界！