jQuery Mobile 图标

我们�以使用图标类在 jQuery Mobile 中 <a> 和 <button> 元素上添加图标,并对图标进行定�,如下所示:


<a href="#anylink" class="ui-btn ui-icon-refresh ui-btn-icon-left">刷新页�</a> �试一下

<button class="ui-btn ui-icon-refresh ui-btn-icon-left">刷新页�</button> �试一下

在 <input> 按钮中添加图标,�以使用 data-icon 属性:


<a href="#anylink" data-icon="refresh">刷新页�</a> �试一下

我们�以使用 data-icon 属性在导航按钮上添加图标:


<a href="#anylink" data-icon="refresh">刷新页�</a> �试一下

如果�在列表按钮中添加图标,�以在 <li> 中使用 data-icon 属性:


<li data-icon="refresh"><a href="#">点我</a></li> �试一下

下�我们列出了 jQuery Mobile �供的所有�用图标:

值 �述 图标 实例
action 动作 �试一下
alert 警告 �试一下
audio 视频 / 音频 / 扬声器 �试一下
arrow-d-l 左下角 �试一下
arrow-d-r �下角 �试一下
arrow-u-l 左上角 �试一下
arrow-u-r �上角 �试一下
arrow-l 左箭头 �试一下
arrow-r �箭头 �试一下
arrow-u 上箭头 �试一下
arrow-d 下箭头 �试一下
back 返回 �试一下
bars �目 �试一下
bullets 栅� �试一下
calendar 日历 �试一下
camera 照相机 �试一下
carat-d �下 �试一下
carat-l �左 �试一下
carat-r �� �试一下
carat-u �上 �试一下
check 验�标记 �试一下
clock 时钟 �试一下
cloud 云 �试一下
comment 评论 �试一下
delete 删除 (X) �试一下
edit 编辑 / 铅笔 �试一下
eye 眼� �试一下
forbidden �止标记 �试一下
forward �进 �试一下
gear 齿轮 �试一下
grid 网格 �试一下
heart 心 / 爱 标志 �试一下
home 家(主页) �试一下
info 信� �试一下
location 定� / GPS �试一下
lock � / 挂� �试一下
mail 邮件 / 信� �试一下
minus 符���� �试一下
navigation 导航 �试一下
phone 电� �试一下
power 开关 (On/off) �试一下
plus 加� �试一下
recycle 回收 �试一下
refresh 刷新 �试一下
search �索 �试一下
shop 商店�钱包�手�袋 �试一下
star 星� �试一下
tag 标签 �试一下
user 用户 �试一下
video 摄�机 �试一下