layui让文字和div平行_layui常见表单排版,水平+垂直排版

平常我们经常用到的表单排版方式常见的有两种,layui文档中已经给出垂直的排版方式,来源:https://www.layui.com/doc/element/form.html ,我们做后台的时候也会用到水平排版方式,用于在页面的顶部进行搜索的时候用到.我简单写了几个效果,仅供参考.

一.水平排版

新增商品

状态：

启用

禁用

暂时

创建时间：

style="width: 240px;">

搜索

公共css:.fl { float: left; }

.fr { float: right; }

.mb10{ margin-bottom:10px;}

.sideBlock { padding: 24px; }

.layui-form-item .layui-input-inline { width: auto; }

.layui-input, .layui-select, .layui-textarea{ height:36px;}

.layui-form-label {

padding: 8px 15px;

}

.layui-form-switch {

he