daisyuitailwind設計

用 daisyUI 快速做出漂亮的網頁

什麼是 daisyUI?

daisyUI 把 Tailwind CSS 的 utility class 包裝成有意義的元件名稱。

<!-- 不用再記一堆 class -->
<button class="btn btn-primary">按鈕</button>

<!-- 而不是這樣 -->
<button class="px-4 py-2 bg-blue-600 text-white rounded-lg ...">按鈕</button>

主題系統

只要在 <html> 加上 data-theme,整頁風格就會改變:

<html data-theme="dark">
<html data-theme="cupcake">
<html data-theme="corporate">

內建 35 個主題,一行搞定換色!

結論

daisyUI 是目前最適合搭配 Astro 快速做出漂亮頁面的工具。

← 回文章列表 回首頁