EasyUI toolbar分隔线

来源：互联网发布：淘宝认证复核人脸验证编辑：程序博客网时间：2024/05/01 14:00

问题描述：EasyUI toolbar中添加分隔线时，分隔线会自动跑到最左边。

解决方案一：
使用一个table来创建toolbar，

<div id="toolbar">    <table>        <tr>            <td>                <a href="#" class="easyui-linkbutton" data-options="iconCls:'icon-add',plain:true" onClick="javascript:add();">添加</a>            </td>            <td>                <div class="datagrid-btn-separator"></div>            </td>            <td>                <a href="#" class="easyui-linkbutton" data-options="iconCls:'icon-edit',plain:true" onClick="javascript:upd();">修改</a>            </td>        </tr>    </table></div>

解决方案二：
改变分隔线样式，

<div id="toolbar">    <div>         <a href="#" class="easyui-linkbutton" data-options="iconCls:'icon-add',plain:true" onClick="javascript:add();">添加</a>         <span class="datagrid-btn-separator" style="vertical-align: middle;display:inline-block;float:none"></span>         <a href="#" class="easyui-linkbutton" data-options="iconCls:'icon-edit',plain:true" onClick="javascript:upd();">修改</a>    </div></div>

比较：工具栏工具按钮较多，而窗口又较小时，方案二较好（因为它会分行显示）。

1 0