jQuery Mobile 教程:按钮图标

 时间:2026-02-16 10:42:09

1、向按钮添加图标

 <a href="#" data-role="button" data-icon="arrow-l">左箭头图标</a>

    <a href="#" data-role="button" data-icon="arrow-r">右箭头图标</a>

    <a href="#" data-role="button" data-icon="arrow-u">上箭头图标</a>

    <a href="#" data-role="button" data-icon="arrow-d">下箭头图标</a>

    <a href="#" data-role="button" data-icon="plus">加号图标</a>

    <a href="#" data-role="button" data-icon="minus">减号图标</a>

    <a href="#" data-role="button" data-icon="delete">删除图标</a>

    <a href="#" data-role="button" data-icon="check">检查图标</a>

  

jQuery Mobile 教程:按钮图标

2、向按钮添加图标

  <a href="#" data-role="button" data-icon="home">首页图标</a>

    <a href="#" data-role="button" data-icon="info">信息图标</a>

    <a href="#" data-role="button" data-icon="back">后退图标</a>

    <a href="#" data-role="button" data-icon="forward">向前图标</a>

    <a href="#" data-role="button" data-icon="refresh">刷新图标</a>

    <a href="#" data-role="button" data-icon="grid">网格图标</a>

    <a href="#" data-role="button" data-icon="gear">齿轮图标</a>

   

jQuery Mobile 教程:按钮图标

3、向按钮添加图标

 <a href="#" data-role="button" data-icon="search">搜索图标</a>

    <a href="#" data-role="button" data-icon="star">星形图标</a>

    <a href="#" data-role="button" data-icon="alert">提醒图标</a>

jQuery Mobile 教程:按钮图标

4、定位图标

<a href="#link" data-role="button" data-icon="search" data-iconpos="top">Top</a>

    <a href="#link" data-role="button" data-icon="search" data-iconpos="right">Right</a>

    <a href="#link" data-role="button" data-icon="search" data-iconpos="bottom">Bottom</a>

    <a href="#link" data-role="button" data-icon="search" data-iconpos="left">Left</a>

jQuery Mobile 教程:按钮图标

5、只显示图标

 <a href="#link" data-role="button" data-icon="search" data-iconpos="notext">Search</a>

jQuery Mobile 教程:按钮图标

  • jQuery Mobile 教程:按钮
  • 怎样为Jquery Mobile的页面添加按钮图标
  • jQuery Mobile 教程:主题
  • jQuery Mobile教程: 网格
  • jQuery Mobile 教程:Button Checkbox属性
  • 热门搜索
    阴虱是什么原因得的 元芳你怎么看歌曲 属性与生活 如何挽回老公 尚美生活 执子之手与子偕老是什么意思 tail是什么意思英语 海信手机怎么刷机 低俗生活 欧巴是什么意思