在页面布局时，主要采用的方式有Grid系统或者Flex布局，下面介绍如何在Tailwind中使用Flex布局。
水平方向对齐
首先需要在容器标签上应用flex类及相应的对齐类，比如justify-start,justify-center,justify-end等：
markup
<div class="flex justify-end">
<a href="#" class="text-loginbox">登录</a>
<a href="#" class="text-loginbox ml-2">注册</a>
</div>这样，对应的两个登录按钮就会占据页面右边。
垂直方向对其
如果想要在垂直方向对齐的话，可以使用items-xxx类，比如垂直方向底部对齐：
markup
<div class="flex items-end">
<div class="bg-blue-600 h-10 w-20">Content block 1</div>
<div class="bg-yellow-600 h-12 w-20">Content block 2</div>
<div class="bg-red-600 h-16 w-20">Content block 3</div>
</div>水平和垂直方向对齐可以搭配一起使用：
markup
<div class="flex items-end justify-end">
