Layui 是一套免费的开源 Web UI 组件库，正确使用会让本身的页面更加美化，减少代码的错误性，可以更简单快速地构建网页界面。
特点：
- 原生态开发
- 轻量级模块化
- 外简内丰
- 开箱即用
首先进入官网layui.dev/ 点击使用，进去后根据文本指示。
有四种使用方式:
-
官网直接下载到自己的环境中
layui/css/layui.css layui/layui.js -
Git下载：通过 [GitHub] 或 [Gitee] 的 releases 列表下载，或直接下载整个仓库
-
CDN方式引用
<!-- 引入 layui.css --> <link href="//unpkg.com/layui@2.8.18rc.2/dist/css/layui.css"rel="stylesheet"> <!-- 引入 layui.js --> <script src="//unpkg.com/layui@2.8.18-rc.2/dist/layui.js"></script> -
npm下载
npm i layui
当我们开始使用的时候，选择自己需要的样式，在</>中查看代码，样式主体在div内部，可以先全部复制，再去删除不需要的部分，修改完善。
我们可以简单做一个按钮混搭：
<div class="layui-btn-container">
<button type="button" class="layui-btn layui-btn-lg layui-btn-primary layui-btn-radius">大型加圆角</button>
<a href="/" class="layui-btn" target="_blank">跳转的按钮</a>
<button type="button" class="layui-btn layui-btn-sm layui-btn-normal">
<i class="layui-icon layui-icon-delete"></i> 删除</button>
<button type="button" class="layui-btn layui-btn-xs layui-btn-disabled">
<i class="layui-icon layui-icon-share"></i> 分享</button>
</div>
