栅格系统与后台布局 一、栅格布局规则： 二、响应式规则： 三、响应式公共类： 四、布局容器： 五、列间距： 六、列偏移： 七、栅格嵌套： 八、让IE8/9兼容栅格： 栅格系统与后台布局 如你所愿，在 layui 2.0 的版本中，我们加入了强劲的栅格系统和后台布局方案，这意味着你终于可以着手采用 layui 排版你的响应式网站和后台...

按钮 - 页面元素 用法 主题 尺寸 圆角 图标 按钮组 按钮容器 按钮 - 页面元素 向任意HTML元素设定class=”layui-btn”，建立一个基础按钮。通过追加格式为layui-btn-{type}的class来定义其它按钮风格。内置的按钮class可以进行任意组合，从而形成更多种按钮风格。 用法 <button...

导航相关 - 页面元素 水平导航 导航中的其它元素 导航主题 垂直/侧边导航 导航可选属性 面包屑 导航相关 - 页面元素 导航一般指页面引导性频道集合，多以菜单的形式呈现，可应用于头部和侧边，是整个网页画龙点晴般的存在。面包屑结构简单，支持自定义分隔符。千万不要忘了加载 element模块。虽然大部分行为都是在加载完该模块后自动完成的...

页面元素规范与说明 CSS内置公共基础类 CSS命名规范 HTML规范：结构 HTML规范：常用公共属性 页面元素规范与说明 layui 提倡返璞归真，遵循于原生态的元素书写规则，所以通常而言，你仍然是在写基本的 HTML 和 CSS 代码，不同的是，在 HTML 结构上及 CSS 定义上需要小小遵循一定的规范。 CSS内置公共基...

徽章 快速使用 与其它元素的搭配 徽章 徽章是一个修饰性的元素，它们本身细小而并不显眼，但掺杂在其它元素中就显得尤为突出了。页面往往因徽章的陪衬，而显得十分和谐。 快速使用 不妨先来看看 徽章 这个小小的大家族吧： 你可能已经敏锐地发现，除去花枝招展的七种颜色，徽章具有三种不同的风格类型：小圆点、椭圆体、边框体 ...

面板 - 页面元素 卡片面板 折叠面板 开启手风琴 面板 - 页面元素 一般的面板通常是指一个独立的容器，而折叠面板则能有效地节省页面的可视面积，非常适合应用于：QA说明、帮助文档等 依赖加载组件：element 卡片面板 <div class = "layui-card" > <div class = "l...

图形扩展 图形扩展 编写Java类，实现ShapeExecutor @Component public class RedisExecutor implements ShapeExecutor { @Override public String supportShape () { ...

图形扩展 图形扩展 编写Java类，实现ShapeExecutor @Component public class RedisExecutor implements ShapeExecutor { @Override public String supportShape () { ...

时间线 快速使用 时间线 将时间抽象到二维平面，垂直呈现一段从过去到现在的故事。 快速使用 <ul class = "layui-timeline" > <li class = "layui-timeline-item" > <i class = "layui-icon layui-timeline-...

进度条 - 页面元素 常规用法 显示进度比文本 大号进度条 进度条 - 页面元素 进度条可应用于许多业务场景，如任务完成进度、loading等等，是一种较为直观的表达元素。 依赖加载组件：element 常规用法 我们进度条提供了两种尺寸及多种颜色的显示风格，其中颜色的选值可参考：背景色公共类 。基本元素结构如下 <div...