现在的位置: 首页 > 综合 > 正文

jQuery EasyUI — 按钮间的自定义竖线(分隔线)样式

2017年12月02日 ⁄ 综合 ⁄ 共 736字 ⁄ 字号 评论关闭

1.css样式定义:

div .btn-separator {
  float: left;
  height: 24px;
  border-left: 1px solid LightGrey;
  border-right: 0px solid LightGrey;
  margin: 1px 1px;
}

2.html中需编写的代码:

<td><div class="btn-separator"></div></td>

3.源文件参照:

<div id="dlg" class="easyui-dialog" title="Complex Toolbar on Dialog" style="width:400px;height:200px;padding:10px"
		data-options="
			iconCls: 'icon-save',
			toolbar: '#dlg-toolbar'
		">
	The dialog content.
</div>
<div id="dlg-toolbar">
	<table cellpadding="0" cellspacing="0">
		<tr>
			<td>
				<a href="javascript:void(0)" class="easyui-linkbutton" data-options="iconCls:'icon-edit',plain:true">Edit</a>
			</td>
			<td><div class="btn-separator"></div></td>
			<td>
				<a href="javascript:void(0)" class="easyui-linkbutton" data-options="iconCls:'icon-help',plain:true">Help</a>
			</td>
		</tr>
	</table>
</div>

效果截图:

抱歉!评论已关闭.