flex
flex
justify-center
items-center
gap-4
grid
grid
grid-cols-2
md:grid-cols-3 ←画面幅が 768px以上(中サイズ以上)(注意→ me:の後にスペースを入れない)
gap-6
Tailwindの標準ブレークポイント
sm: 640px
md: 768px
lg: 1024px
xl: 1280px
2xl: 1536px
padding
px-4 → 左右
py-4 → 上下
pt-4 → 上
pb-4 → 下
pl-4 → 左
pr-4 → 右
margin
mx-4 → 左右
my-4 → 上下
mt-4 → 上
mb-4 → 下
ml-4 → 左
mr-4 → 右
mx-auto = margin-left/right auto
数値の意味
p-1 = 0.25rem
p-2 = 0.5rem
p-4 = 1rem
p-8 = 2rem
テキスト
text-sm
text-base
text-lg
text-xl
text-2xl
font-bold
font-medium
text-gray-500
text-black
text-center