Tailwind CSS 实战：打造质感卡片与渐变标题

渐变标题

<p class="bg-gradient-to-r from-brand-600 to-indigo-500 bg-clip-text text-transparent">
  渐变文字
</p>

卡片悬停上浮

<div class="rounded-xl border p-6 transition hover:-translate-y-1 hover:shadow-lg">
  内容
</div>

要点：用 transition 平滑过渡，hover:-translate-y-1 让卡片轻微上浮，配合 hover:shadow-lg 增强层次。