🔥码云GVP开源项目 12k star Uniapp+ElementUI 功能强大 支持多语言、二开方便! 广告
# 组件样式 ## 5.2.组件样式 | 类名(class) | 说明 | | --- | --- | | icon-btn | 带图标的按钮,会缩小边距 | | icon-date | 在元素的右边加入日期的图标 | | icon-search | 在元素的右边加入搜索的图标 | | btn-circle | 圆形按钮,参见便签界面 | | arrow2 | 设置侧边栏小三角为箭头图标,加在layui-nav上 | | arrow3 | 设置侧边栏小三角为加减号图标,加在layui-nav上 | | close-footer | 关闭页脚,加在body上 | | hide-body-title | 全局隐藏单标签模式标题栏,加在body上 | | table-tool-mini | 数据表格工具栏mini样式,加在table父元素上 | | full-table | 针对full-xxx的table的工具栏mini样式 | | mini-bar | 如果有滚动条,使用细的风格 | | layui-form-select-top | 控制下拉框上弹出,加载select父元素上 | | ew-tb-cell-ck | 数据表格里面checkbox | | ew-field-group | easyweb的字段集辅助类 | ~~~ <!-- 图标按钮 --> <button class="layui-btn icon-btn"><i class="layui-icon">&#xe615;</i>搜索</button> <!-- 日期图标 --> <input class="layui-input icon-date" type="text"/> <!-- 搜索图标 --> <input class="layui-input icon-search" type="text"/> <!-- 圆形按钮 --> <div class="btn-circle"> <i class="layui-icon layui-icon-add-1"></i> </div> <!-- 下拉框上弹出 --> <div class="layui-form-select-top"> <select>....</select> </div> <!-- 关闭页脚 --> <body class="layui-layout-body close-footer"> <!-- 表格工具栏mini样式 --> <div class="table-tool-mini full-table"> <table id="xxTable" lay-filter="xxTable"></table> </div> <!-- 字段集嵌套数据表格 --> <div class="ew-field-group"> <fieldset class="layui-elem-field"> <legend>我是标题</legend> </fieldset> <div class="ew-field-box"> <table id="demoFieldTb" lay-filter="demoFieldTb"></table> </div> </div> ~~~ ![](https://s2.ax1x.com/2019/08/28/mTfj0K.png) ![](https://s2.ax1x.com/2019/07/06/ZwTtMD.jpg) ![](https://s2.ax1x.com/2019/07/11/Z2UdEV.png)