Question

我有一个Metro应用程序，其中包含2个列表视图和一些列表项。默认情况下，这两个列表视图一个在另一个之下，每当我向我的页面添加一个列表视图时，所有列表视图都显示在另一个之下。问题是我不想水平显示那些列表视图。我想让它们并排显示。所以，任何人都可以帮助我如何排列列表视图，这将有Metro应用程序的外观。

谢谢。

Answer 1

CSS

.ms-grid
{
    display: -ms-grid;
    -ms-grid-rows: 1fr;
    -ms-grid-columns: 1fr 1fr;
}

HTML

<div class="ms-grid">
    <div data-win-control="WinJS.UI.ListView"></div>
    <div data-win-control="WinJS.UI.ListView" style="-ms-grid-column: 2;"></div>
</div>

如何使用HTML5，WinJS在Metro Apps的垂直列中排列列表视图？

1 个答案: