四种方式
比如想要做这样一个布局，有哪几种方式。
最简单、最快捷的方式。
element-ui提供的布局容器，el-header头标签，有height属性。el-aside左侧边栏标签，有width属性。el-footer底部标签，有height属性。其他样式可以通过class进行控制。
相对简单的方式。
利用el-col将每行分为24等分的特性，进行布局。其他属性通过class进行控制。
原生css布局的方式，float布局，也是最基础的方式。
将aside向左浮动，固定好宽度。main向右浮动，注意固定好宽度是 100vw - 左侧边栏的宽度 ，注意高度是 100vh - 上下header和footer高度之和 。footer也由于浮动而被挤到到最下面，这边指定float为left、right都是可以的，都可以达到浮动到最下方的效果。
原生css布局的方式，position布局，也是最基础的方式。
sideBar设置好宽度，利用绝对定位将固定在最左边（由于是绝对定位，所以注意已经脱离了文档流）。main设置margin-left为侧边栏宽度，这样就可以使得main不会被遮挡。footer设置为固定定位，bottom为0固定在底部。其他height、width的值也要注意计算哦~
是你没有设置好，任何标签的100%是相对于父亲节点而言的，如果你连父亲节点都不确定是多高的话，那你当前节点设置成100%是没有意义的。因此，你看一下你的代码，把它所有的长辈节点设置为height:100%
众所周知，所有网页的根节点是html，然后是body,因此这两个节点是一定要设置为100%的。
另外如果你用的是asp.net，很可能还会有一个form节点，这个节点也是要设置为100%的
因此，body,html,form{height:100%}，如果你的排版节点直接放在body下面，这样写就可以实现你要的效果了
#left,#right{float：left}<div id=left></div>
<div id=right></div>
浮动型设置为left 就可以使下面的2个DIV采用左右两栏的形式布局了！！
如果2个DIV过宽 那么会另起一行显示！！！
