网格布局的简单应用（display: grid;）

我们在做布局的时候经常会发现有些地方的宽高排列都非常规则，而且有多行内容，这时使用网格（grid）布局就非常的方便快捷了。那么接下来我们做个简单的九宫格来看看该如何使用该布局：

实例

很明显九宫格就是九个小方块，那么我们可以用一个大盒子去套九个小盒子：

<div id="main">
        <div class="box1"></div>
        <div class="box2"></div>
        <div class="box3"></div>
        <div class="box4"></div>
        <div class="box5"></div>
        <div class