最早的时候用过bootstrap，接着就是layui，再接着接触了Vue，然后就认识了element-ui，今天，想写一个系列的文章记录下我上一阶段学习element-ui的过程，首先先从布局开始。

首先，其实我接触的前端框架的布局方式，都特别的像，基本上你如果运用一个很熟练了，其他的一点就通。

（1）el-row和el-col配合使用

这个el-row定义的就是一行，然后这行被分为24列，这24列被el-col分配，配置里面的:span属性就可以分配这一行空间了。

el-row el-col

            1.1：列与列之间的间距可以在el-row中绑定：gutter来设定，：gutter绑定的是px

：gutter

            1.2：列的偏移量：el-col中绑定：：offset=""来设置，绑定的是栏数

:    offset

            1.3 :对齐方式(left,center,right)

                设置el-row中的属性type，justify设置不同的对齐方式（start（左）, center（中）, end（右）, space-between（列之间中间平均分配）, space-around（整行平均列之间全部平均分配） ）

type，justify space-between，space-around

补充：xs、sm、md、lg 和 xl，至此的不同屏幕大小下的响应式布局。

好了，以上了解的就是关于布局的全部内容了，下面在来补充一点用来构建后天管理系统的布局搭建

（1）会使用el-container,el-main,el-aside,el-header,el-footer来快速布局

el-main,el-aside（有width属性）,el-header（height属性）,el-footer（height属性）必须要在el-container里面

概要