Grid布局

基本概念

    <div class="container">
        <div class="item">1</div>
        <div class="item">2</div>
        <div class="item">3</div>
        <div class="item">4</div>
        <div class="item">5</div>
        <div class="item">6</div>
        <div class="item">7</div>
        <div class="item">8</div>
        <div class="item">9</div>
    </div>

• 网格布局与弹性布局相似，指定容器内部项目的排列方式。
• 将容器分为行列，行列相交的位置为单元格，项目被放置进不同单元格内完成布局。
• 代码中外层的为容器，容器内的子元素为项目。

容器属性

容器css样式：

    .container