jQuery Mobile 是创建移动 web 应用程序的框架。

jQuery Mobile 适用于所有流行的智能手机和平板电脑。

jQuery Mobile 使用 HTML5 和 CSS3 通过尽可能少的脚本对页面进行布局。

实例

<div data-role="page" id="pageone">
  <div data-role="header">
    <h1>在此处写入标题</h1>
  </div>

  <div data-role="content">
    <p>在此处写入正文</p>
  </div>

  <div data-role="footer">
    <h1>在此处写入页脚文本</h1>
  </div>
</div>

jQuery Mobile 是一个为触控优化的框架，用于创建移动 web 应用程序。

jQuery 适用于所有流行的智能手机和平板电脑

jQuery Mobile 安装

下载 jQuery Mobile

<head>
<link rel=stylesheet href=jquery.mobile-1.3.2.css>
<script src=jquery.js></script>
<script src=jquery.mobile-1.3.2.js></script>
</head>

页面实例

<body>
<div data-role="page">

  <div data-role="header">
    <h1>欢迎访问我的主页</h1>
  </div>

  <div data-role="content">
    <p>我是一名移动开发者！</p>
  </div>

  <div data-role="footer">
    <h1>页脚文本</h1>
  </div>

</div>
</body>

data-role="page" 是显示在浏览器中的页面
data-role="header" 创建页面上方的工具栏（常用于标题和搜索按钮）
data-role="content" 定义页面的内容，比如文本、图像、表单和按钮，等等
data-role="footer" 创建页面底部的工具栏

添加页面

<div data-role="page" id="pageone">
  <div data-role="content">
    <a href="#pagetwo">转到页面二</a>
  </div>
</div>

<div data-role="page" id="pagetwo">
  <div data-role="content">
    <a href="#pageone">转到页面一</a>
  </div>
</div>

posted on 2015-08-16 23:58 咖啡不放糖阅读(165) 评论(0) 收藏举报

刷新页面返回顶部