AppView for ASP.NET WebForms
d. Home フォルダ要素の作成
チュートリアル > イベント計画アプリケーションの作成 > 手順 2:アプリケーションの Web フォームの作成 > d. Home フォルダ要素の作成

この手順では、Home フォルダ内のアプリケーション要素を作成します。

  1. Home フォルダから、About ファイルをダブルクリックして開きます。既存のマークアップを次の内容に置き換えます。

    追加するマークアップ

    コードのコピー
    <div data-role="appviewpage" data-title="About">
          <div data-role="header"><h2>バージョン情報</h2></div>
          <div data-role="content">
                <article>
                      <p>
                            追加情報を示すために、この領域を使用します。
                      </p>
                </article>
                <aside>
                      <h3>Aside Title</h3>
                      <p>
                            追加情報を示すために、この領域を使用します。
                      </p>
                      <ul>
                            <li><a href="Index.aspx">Home</a></li>
                            <li><a href="About.aspx">About</a></li>
                            <li><a href="Contact.aspx">Contact</a></li>
                      </ul>
                </aside>
          </div>
    </div>
  2. Home フォルダから、Contact ファイルをダブルクリックして開きます。既存のマークアップを次の内容に置き換えます。

    追加するマークアップ

    コードのコピー
    <div data-role="appviewpage" data-title="Contact">
          <div data-role="header"><h2>連絡先</h2></div>
          <div data-role="content">
                <h3>電話番号</h3>
                <span>425.555.0100</span>
                <h3>メール</h3>
                <span><a href="mailto:General@example.com">General@example.com</a></span>
          </div>
    </div>
  3. Home フォルダから、Index ファイルをダブルクリックして開きます。既存のマークアップを次の内容に置き換えます。

    追加するマークアップ

    コードのコピー
    <div data-role="appviewpage" data-title="Index">
          <div data-role="header"><h2>ホームページ</h2></div>
          <div data-role="content">
                <p>
                      このアプリケーションは Wijmo と jQuery Mobile を使用してビルドします。Wijmo の詳細については、<a href="http://wijmo.com"> を参照してください。
                </p>
          </div>
    </div>