layui初识
layui
是什么？
是一个ui库 UI设计（或称界面设计）是指对软件的人机交互、操作逻辑、界面美观的整体设计。UI设计分为实体UI和虚拟UI，互联网常用的UI设计是虚拟UI，UI即User Interface(用户界面)的简称。
大致内容
观察layui文件内的内部结构
├─css //css目录
│ │─modules //模块css目录（一般如果模块相对较大，我们会单独提取，比如下面三个：）
│ │ ├─laydate
│ │ ├─layer
│ │ └─layim
│ └─layui.css //核心样式文件
├─font //字体图标目录
├─images //图片资源目录（目前只有layim和编辑器用到的GIF表情）
│─lay //模块核心目录
│ └─modules //各模块组件
│─layui.js //基础核心库
└─layui.all.js //包含layui.js和所有模块的合并文件
怎么在代码中引入？
<!DOCTYPE html><html><head> <meta charset="utf-8"> <meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1"> <title>开始使用layui</title> <link rel="stylesheet" href="../layui/css/layui.css"></head><body> <!-- 你的HTML代码 --> <script src="../layui/layui.js"></script><script>//一般直接写在一个js文件中layui.use(['layer', 'form'], function(){ var layer = layui.layer ,form = layui.form; layer.msg('Hello World');});</script> </body></html>
认识layui：
模块化
layui.use(['layer', 'form'], function(){ var layer = layui.layer ,form = layui.form;});公共类：
layui-icon 用于图标
layui-bg-red 用于设置元素赤色背景
公共属性
| 属性 | 描述 |
|---|---|
| lay-skin=" " | 定义相同元素的不同风格，如checkbox的开关风格 |
| lay-filter=" " | 事件过滤器。你可能会在很多地方看到他，他一般是用于监听特定的自定义事件。你可以把它看作是一个ID选择器 |
| lay-submit | 定义一个触发表单提交的button，不用填写值 |
页面元素 (静态)
只与HTML有关，样式通通通过layui的公共类来实现
内置模块 (动态)
属性
方法
事件
[其他的就需要自己去查，最好把常用的元素以及模块用熟，但是不熟悉也不要紧]
Example
表单 form -form
导航栏/选项卡 element --->nav/tab
数据表格 table--->table
弹窗 layer
赞 (0)