在刚开始用element-plus的布局时,发现无法占满屏幕:
在App.vue
中添加如下css代码:
<style>html, body, #app {margin: 0;padding: 0;height: 100%;}
</style>
同时布局代码所在的component如下所示:
<template><div class="common-layout"><el-container><el-header id="header">Header</el-header><el-main id="main">Main</el-main></el-container></div>
</template><script setup lang="ts">
</script><style>.common-layout, .el-container {height: 100%;}
</style>
即可保证占满屏幕: