WinJS开发div中元素的水平和垂直居中metro

WinJS开发win8应用是用html和css做的界面，经常需要内容水平或垂直居中。

此时就需要网格布局来实现了，也很方便和容易。

构造出水平或垂直居中内容，需要两个div。

div1 填充整个区域，并设置为1行1列的网格布局：

.div1{
    100%;
    height:100%;
    display:-ms-grid;
    -ms-grid-columns:1fr;
    -ms-grid-rows:1fr;
}

div2 在网格内并包裹要居中的内容。就可以设置网格居中的css样式了从而达到内容居中：

.div2{
     -ms-grid-row-align:center;
    -ms-grid-column-align:center;
}

这样就做到了内容的垂直水平居中。

备注：

-ms-grid-row-align 设置内容在行中的对其方式  start行头 end行尾  center行的中间

-ms-grid-column-align 设置内容在列中的对其方式     start列头  end列尾  center列的中间