顺风媒体查询的问题

Question

这会正常运行并导致文本在小断点处变大（与我想要的相反）

text-md sm:text-sm

当我尝试反转它以获得所需的效果时，所有断点的文本大小保持为“sm”。不像我预期的那样表现。

text-sm sm:text-md

我在这里做错了什么吗？

如果有帮助，这是一个简单的 p 标签：

<p className="text-center mb-8 text-md sm:text-sm">

我已经尝试了断点类的每一种组合以使其正确调整但没有成功，并且无法在网上找到任何足够具体的信息

Answer 1

Tailwind 使用移动优先的方法。

sm:text-sm

将在

sm

以及

sm

断点上方的屏幕中将字体大小设置为小。 您需要做的是使用移动优先方法。因此，为较小的断点设置一个默认类，并为较大的断点应用媒体查询。

我会做这样的事情：

<p className="text-center mb-8 text-sm md:text-md ">