ページを作成します。
jQueryのモバイルは、すべてのモバイルデバイス上で動作するにもかかわらず、それは（が限られCSS3のサポートに）、デスクトップコンピュータ上のいくつかの互換性の問題を有していてもよいです。
このチュートリアルでは、我々はあなたがより良い読書体験のGoogle Chromeブラウザを使用することをお勧めします。
以下では、簡単な、標準のjQueryモバイルページを作成しました：
例
<body>
<div data-role="page" >
<div
data-role="header" >
<h1>Welcome To My Homepage</h1>
</div>
<div data-role="main" class="ui-content" >
<p>I Am Now A Mobile Developer!!</p>
</div>
<div data-role="footer" >
<h1>Footer
Text</h1>
</div>
</div>
</body> »それを自分で試してみてください 例を説明しました：
- data-role="page" 、ブラウザに表示されたページです
- data-role="header" （多くの場合、タイトルや検索ボタンに使用）ページの上部にあるツールバーを作成します。
- data-role="main"テキスト、画像、ボタン、フォーム、などのように、ページの内容を定義します
- "ui-content"クラスは、ページコンテンツの内側に余分なパディングとマージンを追加します
- data-role="footer"ページの下部にツールバーを作成します
- など、段落、画像、見出し、リスト、 - これらのコンテナ内では、任意のHTML要素を追加することができます
HTML5 data-*属性が作成するjQueryのモバイル全体で使用されている"touch-friendly"モバイルデバイスのための、魅力的な外観を。
jQueryのモバイルにページを追加します
jQueryのモバイルで、あなたは、単一のHTMLファイル内の複数のページを作成することができます。
一意のIDと、各ページを分離して使用するhrefそれらの間にリンクする属性を：
例
<div data-role="page" id="pageone" >
<div data-role="main" class="ui-content">
<a href="#pagetwo" >Go to
Page Two</a>
</div>
</div>
<div data-role="page"
id="pagetwo" >
<div
data-role="main" class="ui-content">
<a href="#pageone" >Go to Page
One</a>
</div>
</div> »それを自分で試してみてください ヒント：ロード時間は、コンテンツ（すなわちテキスト、リンク、画像、スクリプトなど）の多くのWebアプリケーションによって影響を受けることになります。 あなたが内部的にページをリンクしたくない場合は、外部ファイルを使用します。
<a href="externalfile.html">Go To External Page</a>
ダイアログとして使用しているページ
ダイアログボックスには、特別な情報や要求入力を表示するために使用されるウィンドウのタイプです。
ユーザーがリンクをタップしたときに表示されるダイアログボックスを作成するには、追加data-dialog="true"使用すると、ダイアログとして表示するページに：
例
<div data-role="page" id="pageone">
<div
data-role="main" class="ui-content">
<a href="#pagetwo">Go to Page Two</a>
</div>
</div>
<div data-role="page"
data-dialog="true" id="pagetwo">
<div
data-role="main" class="ui-content">
<a href="#pageone">Go to Page One</a>
</div>
</div> »それを自分で試してみてください