布局容器引入及基本样式调整效果
代码
Main.vue
<div>
<el-container style="height: 100vh">
<el-header style="padding: 10px 20px">学生信息管理系统</el-header>
<el-container>
<el-aside width="150px">
<Aside />
</el-aside>
<el-container>
<el-main style="padding:0px">
Main
</el-main>
</el-container>
</el-container>
<el-footer style="height:25px">
学生信息管理系统v3.1.2 @版权所有:ZQM 2099-01-01
</el-footer>
</el-container>
</div>
<style>
.el-footer{
text-align: center;
}
.el-header{
text-align: center;
font-size: xx-large;
font-weight: bold;
}
</style>