美文网首页
elment-ui的布局

elment-ui的布局

作者: 沐文乘光 | 来源:发表于2019-12-06 11:02 被阅读0次

综述

element-ui 有el-container/ el-header/el-main/el-footer 进行相关的布局摆设,现在分别介绍这些布局的基本效果和特点

el-container

首先在template里面写个空的el-container,会发现它的高度默认是0

空的el-container高度默认是0

el-container里面再嵌套子container,那么子container会占满父container

子container会铺满父container

el-container里面嵌套多个子container,那么多个子container会平均分配空间内容

多个子container会平均分配空间内容

另外也会发现,el-container里面的控件会水平排列

在el-container中,只有el-header/el-main/el-footer会垂直布局

去掉el-container的match-parent, 看看header/main/footer,它们都有最小高度限制,因此各自撑开一定的区域

将header/main/footer放到一个子container看看,两个子container将父container平分

相关文章

网友评论

      本文标题:elment-ui的布局

      本文链接:https://www.haomeiwen.com/subject/jpmsgctx.html