使用 jQuery Mobile 入門

　　提示：盡管 jQuery Mobile 適用于所有移動設(shè)備，它在臺式計算機上仍然可能存在兼容性問題(由于有限的 CSS3 支持)。

　　因此在本教程中，我們推薦您使用谷歌的 Chrome 瀏覽器，以獲得最好的閱讀體驗。

　　實例

data-role="page">

  
data-role="header">
    
歡迎訪問我的主頁
  

  
data-role="content">
    
我是一名移動開發(fā)者！
  

  
data-role="footer">
    
頁腳文本
  

　　例子解釋：

　　data-role="page" 是顯示在瀏覽器中的頁面

　　data-role="header" 創(chuàng)建頁面上方的工具欄(常用于標(biāo)題和搜索按鈕)

　　data-role="content" 定義頁面的內(nèi)容，比如文本、圖像、表單和按鈕，等等

　　data-role="footer" 創(chuàng)建頁面底部的工具欄

　　在這些容器中，您可以添加任意 HTML 元素 - 段落、圖像、標(biāo)題、列表等等。

　　提示：HTML5 data-* 屬性用于通過 jQuery Mobile 為移動設(shè)備創(chuàng)建“對觸控友好的”交互外觀。在 jQuery Mobile 中添加頁面

　　在 jQuery Mobile，您可以在單一 HTML 文件中創(chuàng)建多個頁面。

　　請通過唯一的 id 來分隔每張頁面，并使用 href 屬性來連接彼此：

id="pageone">
  

    轉(zhuǎn)到頁面二
  


id="pagetwo">
  

    轉(zhuǎn)到頁面一
  

href="externalfile.html">轉(zhuǎn)到外部頁面

　　將頁面用作對話框

　　對話框是用來顯示信息或請求輸入的視窗類型。

　　如需在用戶點擊(輕觸)鏈接時創(chuàng)建一個對話框，請向該鏈接添加 data-rel="dialog"：

　　實例

  

    data-rel="dialog">轉(zhuǎn)到頁面二
  



  

    轉(zhuǎn)到頁面一