tailwind css + vuejs3实现过渡（transition）效果

tailwind css + vue3 = easy and beautiful transitions

不得不说，tailwind css 和vuejs可真是绝配，在transition效果的实现上也是如此。本文将简洁地分享使用tailwindcss 和 vuejs 3实现过渡的干货。

以下的知识讲帮助读者更轻松地掌握文中的内容：

• vue.js3 与 tailwind css 的搭建与整合（使用vite）。
• vuejs 与 tailwind css的使用和基础知识。
• css基础，尤其关于transition及transform的相关知识。

代码

话不多说，直接上代码：

<div class="flex flex-col text-center">
  <transition appear
  enter-active-class="transition duration-3000 ease-in"
  enter-from-class="opacity-0"
  enter-to-class="opacity-100">
    <img class=" w-48 md:w-80 m-auto mt-20" src="../assets/doggy.jpeg" alt="孤独的犬">
  </transition>
  <div>
    <