一：柵格布局

我們可以使用 行、列 的形式來排布界面上的div，這就是網格化布局。

柵格布局只需要：用一個row類div來組織一個行；行中各個元素用col-XX指定占據行寬百分比。

行中各個單元格默認有15px間距，要取消間距的話只需在row類div處增加no-gutter類（新版中用 no-gap類）即可。

<!--普通行-->
<div class="row">
    <div class="col-33">33%</div>
    <div class="col-33">33%</div>
 

    <div class="col-33">33%</div>
</div>

<!--單元格寬度百分比-->
<div class="row no-gutter">
    <div class="col-50">50%</div>
    <div class="col-50">50%</div>
</div>   

Framework7學習筆記之 柵格布局/網格布局