jQuery Mobile 自定义按钮图标

2014-11-23 22:59:26 · 作者: · 浏览: 21

jQuery Mobile 自带很多按钮小图标,如下图所示:


有时候这些图标无法满足你的要求的时候,jQuery Mobile 允许你进行自定义图标。


一般我们在 jQuery Mobile 中定义个按钮的方法如下:


返回首页


data-icon 的值是 jQuery Mobile 预设好的,完整的列表请看这里


如果我们想使用自己的图标,那么可以指定一个其他的 data-icon 的值,例如


data-icon="send-msg"


然后我们可直接在 CSS 定义:


.ui-icon-send-msg {background:url('/images/mail2_16x16.gif') no-repeat 0 0;}


相当于 ui-icon- 加上你指定的 data-icon 就是对应的 css 的 class 值。