jQuery MiniUI 开发教程 导航控件 ToolBar:工具栏(一)

本文详细介绍了工具栏的创建与复杂应用示例,包括按钮、输入框等元素的使用及布局设计。

摘要生成于 C知道 ,由 DeepSeek-R1 满血版支持, 前往体验 >

[b]ToolBar:工具栏[/b]
[img]http://www.miniui.com/docs/api/images/toolbar.gif[/img]

参考示例:[url=http://www.miniui.com/demo/toolbar/toolbar.html]ToolBar:工具栏[/url]

[b]创建工具栏[/b]
<div class="mini-toolbar">
<a class="mini-button" iconCls="icon-add">增加</a>
<a class="mini-button" iconCls="icon-edit">修改</a>
<a class="mini-button" iconCls="icon-remove">删除</a>
<span class="separator"></span>
<a class="mini-button" plain="true">增加</a>
<a class="mini-button" plain="true">修改</a>
<a class="mini-button" plain="true">删除</a>
<span class="separator"></span>
<input class="mini-textbox" />
<a class="mini-button" plain="true">查询</a>
</div>

[b]复杂工具栏[/b]
<div id="toolbar1" class="mini-toolbar" style="padding:2px;">
<table style="width:100%;">
<tr>
<td style="width:100%;">
<a class="mini-menubutton" plain="true" menu="#popupMenu">文件</a>
<a class="mini-button" iconCls="icon-addfolder" plain="true" enabled="false">增加</a>
<a class="mini-button" iconCls="icon-edit" plain="true">修改</a>
<a class="mini-button" iconCls="icon-remove" plain="true">删除</a>
<span class="separator"></span>
<a class="mini-button" iconCls="icon-reload" plain="true">刷新</a>
<a class="mini-button" iconCls="icon-download" plain="true">下载</a>
</td>
<td style="white-space:nowrap;"><label style="font-family:Verdana;">Filter by: </label>
<input class="mini-textbox" />
</td>
</tr>
</table>
</div>
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值