第十三篇、jQuery Mobile

API-->搜索data

0.page

  data-transition="slide" // 页面切换效果

  data-position="fixed" // 锁定头部或者尾部

0.1 data-role="header" 添加返回按钮或者文字

<style type="text/css">
#home a{
/*针对图片*/
padding: 0px;
background-color: rgba(0,0,0,0);
border: none; /*针对文字*/
margin: 5px auto;
padding: 5px;
}
#home a:focus{
box-shadow: none; /*去掉点击后有阴影的稳定*/
} </style> <div data-role="header" data-theme="a" data-position="fixed" id="home">
<a href="#" data-shadow="false" role="button">文字</a>
<h1>我是头部</h1>
</div>

1.创建Button

  <button>按钮</button>

  <input type="button" value="按钮"/ >

  <a href="#" class="ui-btn ui-shadow(阴影)">按钮</a> // 一排可以放多个按钮ui-btn-inline(横向排列)

  <div data-role="controlgroup" data-type="horizontal(默认是垂直方向排列,指定后没有间距)">

    <a href="#" class="ui-btn ui-shadow">按钮</a>

    <a href="#" class="ui-btn ui-shadow">按钮</a>

    <a href="#" class="ui-btn ui-shadow">按钮</a>

  </div>

  

2.checkboxradio(单选和复选框)

  <label><input type="checkbox"/>苹果</label>

  fieldset(创建一组排序)

  单选框只能选择一个(例如性别的选择)

3.collapsible(可展开项)可以展开文字,列表

  data-collapsed="false"

  data-collapsed-theme="false"

4.Grid Layout 删格系统a-d(2~5列)

  <div class="ui-grid-solo(只有一列)"></div>

5.listview

  无序:

  <ul data-role="listview">

    <li>a</li>

  </ul>

  有序:ol

  过滤的效果(搜索框)

6.navbar

7.popup(弹出窗口)

8.selectmenu

9.jQuery Mobile事件(滑动,长按等等)

上一篇:用IntelliJ IDEA 开发Spring+SpringMVC+Mybatis框架 分步搭建二:配置MyBatis 并测试(2 配置spring-dao和测试)


下一篇:爬虫再探实战(三)———爬取动态加载页面——selenium