我刚开始使用Tailwind,对于如何正确使用网格/行和列有些困惑。以下是我看到的不同方法...
方法1:
<div class="flex flex-wrap -mx-1">
<div class="my-1 px-1 w-1/2">
<!-- Column Content -->
</div>
<div class="my-1 px-1 w-1/2">
<!-- Column Content -->
</div>
</div>
方法二:
<div class="grid grid-cols-2 gap-1">
<div>
<!-- Column Content -->
</div>
<div>
<!-- Column Content -->
</div>
</div>
方法三:
<div class="grid grid-flow-col gap-1">
<div class="col-span-1">
<!-- Column Content -->
</div>
<div class="col-span-1">
<!-- Column Content -->
</div>
</div>
有人能向我解释一下这3种方法之间的区别,以及哪一种是适用于什么应用程序的正确方法吗?
flexbox
模型,而第二个和第三个例子则使用了 CSS Grid。对于所有子类,您可以查看 Tailwind 文档以了解它们的作用。 - disinfor