0

私は Windows 8 開発に不慣れで、Html/Javascript ルートを使用しています。私は Grid テンプレートから始めました。

なぜ追加すると、

テスト内容

.. 本文のコンテンツ エリア html (アイテム テンプレート html ではない) に、プロジェクトを開始したときにテキスト テスト コンテンツ がページに表示されませんか?

元。

    </head>


<div>Test Content</div>

<!-- The content that will be loaded and displayed. -->
<div class="groupdetailpage fragment">
    <header aria-label="Header content" role="banner">
        <button class="win-backbutton" aria-label="Back" disabled type="button"></button>
        <h1 class="titlearea win-type-ellipsis">
            <span class="pagetitle"></span>
        </h1>
    </header>
    <div>Test Content</div>
    <section aria-label="Main content" role="main">
        <div class="itemslist win-selectionstylefilled" title="Test Content" aria-label="List of this group's items" data-win-control="WinJS.UI.ListView" data-win-options="{ selectionMode: 'none' }"></div>
    </section>
</div>

4

1 に答える 1

0

default.css を参照し、グリッド レイアウトを参照することをお勧めします (表示: -ms-grid)

.fragment {
    -ms-grid-columns: 1fr;
    -ms-grid-rows: 128px 1fr;
    display: -ms-grid;
    height: 100%;
    width: 100%;
}

.groupdetailpage.fragment は 100% の幅、高さを取るため、フラグメントの外側のテスト コンテンツ div は表示されません。

.fragment header[role=banner] {
    // since -ms-grid-row is not defined, this element takes row 1
    /* Define a grid with columns for the back button and page title. */
    -ms-grid-columns: 39px 81px 1fr auto;
    -ms-grid-rows: 1fr;
    display: -ms-grid;
}

.fragment section[role=main] 
{
    -ms-grid-row: 2;
}

.groupdetailpage.fragment には、表示には -ms-grid があります。したがって、それぞれ行 1 と 2 を占める .header と section[role=main] のみが表示されます。

このようにセクションを変更すると、テスト コンテンツの div が表示されます。

<section aria-label="Main content" role="main">
    <div>Test Content</div>
</section>

winjs ベースの Windows ストア アプリ開発の鍵となるため、グリッド レイアウトを読むと役立ちます。

于 2013-05-18T07:10:26.397 に答える