css - 如何使用一些 Bootstrap 的移动优先类

Question

我无法理解 bootstrap 4 的移动优先行为。我总是首先为桌面设计，然后从桌面向下移动。

文本居中就是这样一个我不知道如何进行的地方。

例如，我希望一个段落在小于 768 像素的屏幕上居中显示。

所以我查阅了文档https://getbootstrap.com/docs/4.0/utilities/text/并找到类 text-md-center 并认为这就是我需要的。它在不大于 768 像素的中等宽度屏幕上居中放置文本。

但是在使用它时却与我的想法相反 - 它使文本居中显示大于 768 像素的屏幕尺寸。

我假设这就是所谓的“移动优先”。这不是桌面优先设计的意思吗？如何仅在宽度较小的设备上将文本居中？

Answer 1

为您的段落应用 2 个类:text-center 和 text-md-left。

text-center 意味着文本默认居中，然后 text-md-left 意味着它在 768px 宽或更大的屏幕上左对齐。