Advertisement
Advertisement

新足迹

 找回密码
 注册
新足迹 门户 IT专业论坛 查看内容

CSS3: Grid Alignment Level 3

2010-11-8 09:13| 发布者: dalaohu | 查看: 1128| 原文链接

CSS 的fans 可以看一下。

Microsoft Folks Submit Grid model for HTML/CSS to the W3C.

http://www.interoperabilitybridges.com/css3-grid-align/

<style type="text/css">
    #grid     { grid-columns: auto minmax(min-content, 1fr);
                grid-rows: auto minmax(min-content, 1fr) auto
              }
    #title    { grid-column: 1; grid-row: 1 }
    #score    { grid-column: 1; grid-row: 3 }
    #stats    { grid-column: 1; grid-row: 2; grid-row-align: start }
    #board    { grid-column: 2; grid-row: 1; grid-row-span: 2 }
    #controls { grid-column: 2; grid-row: 2; grid-column-align: center }
</style>

<div id="grid">
    <div id="title">Game Title</div>
    <div id="score">Score</div>
    <div id="stats">Stats</div>
    <div id="board">Board</div>
    <div id="controls">Controls</div>
</div>

搞得跟xaml 一样了。
Advertisement
Advertisement


Advertisement
Advertisement
返回顶部