layui-col-md-offset* #控制列向右偏移几列 5.最后,在列(column)元素中放入你自己的任意元素填充内容,完成布局! eg:以中型桌面为例 1 2 3 4 5 6 7 8 9 10 <divclass="layui-container"> <--定义常规主屏幕 --> <divclass="layui-row layui-col-space10"> <-- 定义一行 共有12列 列间距为...
layui-col-space28 layui-col-space30 支持列之间为 1px-30px 区间的所有双数间隔,以及 1px、5px、15px、25px 的单数间隔 下面是一个简单的例子,列间距为10px: 1/3 1/3 1/3 </>code <div class="layui-row layui-col-space10"> <div class="layui-col-md4"> 1/3 </div> <div ...
layui-col-space26 layui-col-space28 layui-col-space30支持列之间为 1px-30px 区间的所有双数间隔,以及 1px、5px、15px、25px 的单数间隔 下面是一个简单的例子,列间距为10px: 1/3 1/3 1/3 <div class="layui-row layui-col-space10"> <div class="layui-col-md4"> 1/3 </div> <div...
layui-col-space28 列之间间隔 28px layui-col-space30 列之间间隔 30px 下面是一个简单的例子,列间距为10px: <divclass="layui-row layui-col-space10"><divclass="layui-col-md4">1/3</div><divclass="layui-col-md4">1/3</div><divclass="layui-col-md4">1/3</div></div> 六、列...
layui-col-space26 layui-col-space28 layui-col-space30 支持列之间为 1px-30px 区间的所有双数间隔,以及 1px、5px、15px、25px 的单数间隔 下面是一个简单的例子,列间距为10px: 1/3 1/3 1/3 </>code <div class="layui-row layui-col-space10"> <div class="layui-col-md4"> 1/3...
1.采用layui-row来定义行,如:<div class="layui-row"></div> 2.采用类似layui-col-md*这样的预设类来定义一组列(column),且放在行(row)内。其中: 变量md代表的是不同屏幕下的标记(可选值见下文) 变量*代表的是该列所占用的12等分数(如6/12),可选值为 1 - 12 ...
二、HTML表单 包含常用的文本框、下拉列表框、单选框、复选框、按钮等表单元素 <divclass="layui-card"><divclass="layui-card-header">响应式组合</div><divclass="layui-card-body"><formclass="layui-form"action=""lay-filter="component-form-element"><divclass="layui-row layui-col-space10 ...
下面是一个简单的例子,列间距为10px: 1/3 1/3 1/3 <div class="layui-row layui-col-space10"> <div class="layui-col-md4"> 1/3 </div> <div class="layui-col-md4"> 1/3 </div> <div class="layui-col-md4"> 1/3
<divclass="layui-row layui-col-space10"><divclass="layui-col-md4">1/3</div><divclass="layui-col-md4">1/3</div><divclass="layui-col-md4">1/3</div></div> 列偏移 <divclass="layui-row"><divclass="layui-col-md4">4/12</div><divclass="layui-col-md4 layui-col-md...
可以对栅格进行无穷层次的嵌套。在列元素(_layui-col-md*_)中插入行元素(_layui-row_),即可完成嵌套。 <h3>列嵌套</h3><divclass="layui-row layui-col-space5"><divclass="layui-col-md5"style="background-color: thistle;"><divclass="layui-row"><divclass="layui-col-md3"style="bac...