layui进度条、面板和布局

一、进度条

用 “layui-progress“ 样式来定义一个进度条

            layui-progress-bar来定义进度条里的进度

layui-progress-big 加粗进度条

相关属性:layui-percent 代表进度值   例:layui-percent =‘50%’

lay-showPercent 是否现实进度值  例:lay-showPercent=“ture”

二、面板

1.卡片面板

相关样式:ayui-col-space 0-30代表卡片之间间隔

layui-card   代表一个卡片

         layui-card-hander  代表卡片的头信息

                    layui-card-body  代表卡片内容

2.常规折叠面板

相关样式:layui-collapse 代表一个折叠面板

                            layui-coll-item 代表一个折叠项

                                            layui-coll-title 代表一个折叠项显示的标题

                            layui-coll-content 代表折叠项展开的内容

                            layui-show 展开

可以监听展开事件

3.手风琴折叠面板

在普通面板上追加lay-accordion=“”

三、布局

layui-col-xs 移动设备

layui-col-sm 平板设备

layui-col-md 桌面设备

layui-row 代表一行

layui-col-md 定义一列     例: layui-col-md 1-12代表当前卡片占整行的x/12 (一共分为12列)

你可能感兴趣的:(layui进度条、面板和布局)