jQuery Mobile 按钮图标
优质
小牛编辑
135浏览
2023-12-01
jQuery Mobile 提供了一套让按钮看起来更称心如意的图标。
添加图标到 jQuery Mobile 按钮
我们可以使用 ui-icon 类将图标添加到按钮上,并可以使用指定类来设置按钮位置。
<a href="#anylink">Search</a>
注意: 在其他方式的按钮上,如列表或表单中的按钮需要使用 data-icon 属性。在接下来的章节中我们会具体介绍。
下面我们列出一些 jQuery Mobile 提供的可用图标:
按钮类 | 描述 | 按钮 | 实例 | ||
---|---|---|---|---|---|
ui-icon-arrow-l | 左箭头 |
只显示图标如果你只想显示图标,可以使用 "notext": 实例:<a href="#anylink" class="ui-btn ui-icon-search ui-btn-icon-notext">搜索</a>移除圆圈默认情况下,所有的图标都有一个灰色的圆圈。如果你不需要它,可以在元素中使用 "ui-nodisc-icon" 类: <a href="#anylink">使用圆圈 (默认)</a><a href="#anylink">去掉圆圈</a> 黑色、白色按钮默认情况下,所有图标都是白色的。 如果需要改变图标颜色为黑色,可以在元素添加 "ui-alt-icon": <a href="#anylink">白色</a><a href="#anylink">黑色</a> |