引用
正如 MDUI 官方所说,MDUI 漂亮,轻量,好用,能让你轻松开发 Material Design 网页应用。MDUI 学习成本很低,只需要懂一点点 html5+css 以及 js 的基础,就能得心应手的使用
安装
MDUI 可以通过简单的 CDN 引用,整体大小 CSS 仅 32KB,JavaScript 仅 19KB,加载更迅速。
CDN:
<!-- MDUI CSS --> <link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/mdui@1.0.1/dist/css/mdui.min.css" integrity="sha384-cLRrMq39HOZdvE0j6yBojO4+1PrHfB7a9l5qLcmRm/fiWXYY+CndJPmyu5FV/9Tw" crossorigin="anonymous" /> <!-- MDUI JavaScript --> <script src="https://cdn.jsdelivr.net/npm/mdui@1.0.1/dist/js/mdui.min.js" integrity="sha384-gCMZcshYKOGRX9r6wbDrvF+TcCCswSHFucUzUPwka+Gr+uHgjlYvkABr95TCOz3A" crossorigin="anonymous" ></script>
也可以通过包管理器安装:
npm
npm install mdui --save
yarn
yarn add mdui
示例
<!doctype html> <html lang="zh-cmn-Hans"> <head> <meta charset="utf-8"> <meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1, shrink-to-fit=no"/> <meta name="renderer" content="webkit"/> <meta name="force-rendering" content="webkit"/> <meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1"/> <!-- MDUI CSS --> <link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/mdui@1.0.1/dist/css/mdui.min.css" integrity="sha384-cLRrMq39HOZdvE0j6yBojO4+1PrHfB7a9l5qLcmRm/fiWXYY+CndJPmyu5FV/9Tw" crossorigin="anonymous" /> <title>Hello, world!</title> </head> <body> <h1>Hello, world!</h1> <!-- MDUI JavaScript --> <script src="https://cdn.jsdelivr.net/npm/mdui@1.0.1/dist/js/mdui.min.js" integrity="sha384-gCMZcshYKOGRX9r6wbDrvF+TcCCswSHFucUzUPwka+Gr+uHgjlYvkABr95TCOz3A" crossorigin="anonymous" ></script> </body> </html>
欢迎来到这里!
我们正在构建一个小众社区,大家在这里相互信任,以平等 • 自由 • 奔放的价值观进行分享交流。最终,希望大家能够找到与自己志同道合的伙伴,共同成长。
注册 关于