搜索组件模块
grid 栅格布局
layout admin 布局
color 颜色
iconfont 字体图标
font 字体大小 颜色
animation 动画
button 按钮
form 表单组
input 输入框
select 下拉选择框
checkbox 复选框
switch 开关
radio 单选框
textarea 文本域
nav 导航菜单
menu 基础通用菜单
breadcrumb 面包屑
tabs 选项卡
progress 进度条
panel 面板 / card
collapse 折叠面板/手风琴
table 表格元素
badge 徽章
timeline 时间线
blockquote 引用块
fieldset 字段集
hr 分割线
layer 弹出层/弹窗综合
laydate 日期时间选择器
laypage 分页
laytpl 模板引擎
table 数据表格
form 表单模块
upload 文件/图片上传
dropdown 下拉菜单
contextmenu 右键菜单
transfer 穿梭框
tree 树形菜单
colorpicker 颜色选择器
element 常用元素操作
slider 滑块
rate 评分
carousel 轮播/跑马灯
layedit 富文本编辑器
flow 信息流/图片懒加载
util 工具集
code 代码文本行修饰
layim
layuiadmin
-

CSS3动画类

在实用价值的前提之下,我们并没有内置过多花俏的动画。而他们同样在 layui 的许多交互元素中,发挥着重要的作用。layui 的动画全部采用 CSS3,因此不支持 ie8 和部分不支持 ie9。
使用方式

动画的使用非常简单,直接对元素赋值动画特定的 class 类名即可。如:

</>code

  1. 其中 layui-anim 是必须的,后面跟着的即是不同的动画类
  2. <div class="layui-anim layui-anim-up"></div>
  3. 循环动画,追加:layui-anim-loop
  4. <div class="layui-anim layui-anim-up layui-anim-loop"></div>
内置CSS3动画一览表

下面是不同的动画类名,点击下述绿色块,可直接预览动画

结语

物不在多,有用则精。

layui - 在每一个细节中,用心与你沟通