介绍
mdui 是一款基于 Material Design 设计风格的前端框架，提供了丰富的 UI 组件和实用的 JavaScript 功能。通过使用 npm 包 mdui，我们可以轻松地在项目中引入 mdui，并快速搭建出美观、易用的界面。
安装
首先，我们需要在项目中安装 mdui：
npm install mdui --save
安装完成后，我们可以在项目的 package.json 文件中看到 mdui 的依赖已经被添加。
引入样式和脚本
在 HTML 页面中，我们需要引入 mdui 的样式和脚本文件。可以通过以下方式来实现：
-- -------------------- ---- ------- --------- ----- ------ ------ ----- ---------------- --------- ----------- ---- -- ---- -- --- ----- ---------------- ------------------------------------------------- ---- ------- --- ----- ---------------- ----------------------- ------- ------ ---- ---- --- ---- -- ---- -- --- ------- ------------------------------------------------------- ---- ------- --- ------- ---------------------------- ------- -------
使用组件
mdui 提供了丰富的 UI 组件，可以用来构建各种类型的界面。下面是一些常用组件的使用示例：
按钮
<button class="mdui-btn">普通按钮</button> <button class="mdui-btn mdui-color-theme">主题颜色按钮</button> <button class="mdui-btn mdui-btn-raised">凸起按钮</button>
卡片
-- -------------------- ---- -------
---- ------------------
---- -------------------------
---- ---------------------- --------------------------------
---- ----------------------------------- -----------
---- -------------------------------------- --------------
------
---- ------------------------------ -------------
---- --------------------------
-- -------- --------------- ------------------- -----
-- -------- --------------- ------------------- -----
------
------对话框
-- -------------------- ---- -------
---- ------------------- ---------------
---- --------------------------------------
---- -------------------------------- -- - -------------
---- ----------------------------
------- --------------- ------------ ---------------------------------
------- --------------- ------------ -------------------------------
------
------
------- --------------- ------------ ---------------------------------------- ---------------使用 JavaScript 功能
mdui 提供了一些实用的 JavaScript 功能，我们可以在项目中使用它们。以下是一些常用功能的使用示例：
滑动菜单
-- -------------------- ---- -------
---- ---- ---
---- ------------------- ------------------
-- --------------- ------------- ------------ -------------------------------------- ---------------- ----------------------------
----- -------------------------- ----------
------
---- ------------------- ---------------
--- ------------------
--- --------------------- ----------------- ------
--- ---------------------
- ----------------------------------------------------------- --------
----------------------------------------------------------------------------------