欢迎访问服务器技术网-www.fuwuqijishu.com

jQuery Mobile 图标

jQuery Mobile fuwuqijishu 2年前 (2022-06-06) 181次浏览 0个评论 扫描二维码

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 摄像机 尝试一下

喜欢 (0)
发表我的评论
取消评论
表情 贴图 加粗 删除线 居中 斜体 签到

Hi,您需要填写昵称和邮箱!

  • 昵称 (必填)
  • 邮箱 (必填)
  • 网址

Warning: error_log(/www/wwwroot/fuwiqijishu/wp-content/plugins/spider-analyser/#log/log-2116.txt): failed to open stream: No such file or directory in /www/wwwroot/fuwiqijishu/wp-content/plugins/spider-analyser/spider.class.php on line 2900