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列)

©著作权归作者所有,转载或内容合作请联系作者
平台声明:文章内容(如有图片或视频亦包括在内)由作者上传并发布,文章内容仅代表作者本人观点,简书系信息发布平台,仅提供信息存储服务。

推荐阅读更多精彩内容