daisyUI如何快速搭建使用 - web建站教程手机端

Tailwind CSS是一个以功能类为主的CSS框架。你可以通过原子类的类名快速构建一个网站，比如 .flex、.pt-4、.text-center、.rotate-90，就可以用HTML代码完成开发，不用自己想各种CSS名字。下面web建站小编给大家简单介绍一下daisyUI如何快速搭建使用！

安装 daisyUI

npm i daisyui

在tailwind.config.js文件里追加 daisyUI 的设置

module.exports = {
  //...
  plugins: [require("daisyui")],
}

示例：

<!-- Tailwind CSS 的写法 -->
<a class="inline-block px-4 py-3 text-sm font-semibold 
    text-cente text-white uppercase transition
    duration-200 ease-in-out bg-indigo-600 
    rounded-md cursor-pointer
    hover:bg-indigo-700">Button</a>

<!-- daisyUI 的写法 -->
<a class="btn btn-primary">Button</a>

在线引入 cdn 地址

<link href="https://cdn.jsdelivr.net/npm/daisyui@2.15.2/dist/full.css" rel="stylesheet" type="text/css" />
<script src="https://cdn.tailwindcss.com"></script>

进入daisyUI中文官网

daisyUI中文文档官网介绍

标签： daisyUI, Tailwind CSS 组件库

上面是“daisyUI如何快速搭建使用”的全面内容，想了解更多关于 前端知识 内容，请继续关注web建站教程。

当前网址：https://m.ipkd.cn/webs_12797.html

声明：本站提供的所有资源部分来自互联网，如果有侵犯您的版权或其他权益，请发送到邮箱：admin@ipkd.cn，我们会在看到邮件的第一时间内为您处理！