码迷,mamicode.com
首页 > Web开发 > 详细

jquery mobile--按钮

时间:2017-07-27 18:15:08      阅读:186      评论:0      收藏:0      [点我收藏+]

标签:get   inline   tar   垂直   date   ade   blog   com   foo   

创建按钮

<div data-role="page">
    <div data-role="header">
        <h1>标题</h1>
    </div>
    <div data-role="main" class="ui-content">
        <a data-role="button">按钮</a>
        <button>按钮</button>
        <input value="按钮" type="button">
    </div>
    <div data-role="footer">
        <h5>注脚</h5>
    </div>
</div>

 

在jquery mobile中,<button>默认是块元素(date-role="button"也是)

 

内联按钮

<a data-role="button" data-inline="true">按钮</a>
<a data-role="button" data-inline="true">按钮</a>

 

组合按钮

水平

<div data-role="main" class="ui-content">
    <div data-role="controlgroup" data-type="horizontal">
      <a data-role="button">按钮</a>
      <a data-role="button">按钮</a>
      <a data-role="button">按钮</a>
  </div> </div>

 

垂直

<div data-role="main" class="ui-content">
    <div data-role="controlgroup" data-type="vertical">
      <a data-role="button">按钮</a>
      <a data-role="button">按钮</a>
      <a data-role="button">按钮</a>
  </div> </div>

 

组合按钮默认为垂直

 

返回按钮

data-rel="back"

添加了这个属性,会忽略href锚(href="#")

data-rel有记忆的特点,无论是从哪个页面到当前页面的,只要返回,就会回到上个页面(如果是对话框页面,点击叉叉,也是这样的特性)

 

 

按钮样式

参考:jQuery Mobile CSS 类参考手册

 

TIP:如果用<a>生成按钮,似乎可以完全用内置class来控制

 

~END

 

jquery mobile--按钮

标签:get   inline   tar   垂直   date   ade   blog   com   foo   

原文地址:http://www.cnblogs.com/jiaoxuanwen/p/7245683.html

(0)
(0)
   
举报
评论 一句话评论(0
登录后才能评论!
© 2014 mamicode.com 版权所有  联系我们:gaon5@hotmail.com
迷上了代码!