梗概

使用响应式前缀来定义不同屏幕尺寸下的样式
可以使用sm、md、lg、xl、2xl等前缀来定义响应式样式

示例

<div class="bg-blue-500 md:bg-red-500 lg:bg-green-500 xl:bg-yellow-500">
    <p class="text-white md:text-black lg:text-white xl:text-black">Responsive Text Color</p>
</div>

这个示例展示了如何在不同屏幕尺寸下应用不同的背景颜色和文本颜色。在小屏幕(md)上，背景色为红色，文本颜色为黑色；在大屏幕(lg)和超大屏幕(xl)上，背景色分别为绿色和黄色，文本颜色分别为白色和黑色。