element-uiWebページの全画面

1.高さを設定します:html、body、#appで100%、App.vueで;

//App.vue
<template>
  <div id="app">
    <router-view/>
  </div>
</template>

<style lang="less">
html, body , #app{
  height: 100%;
}
</style>

2.レイアウトページの最初のel-containerの高さを100%に設定します。

<template>
<el-container class="home-container">
  <el-header>Header</el-header>
  <el-container>
    <Aside></Aside>
    <el-main>
      <router-view></router-view>
    </el-main>
  </el-container>
</el-container>
</template>

<script>
// @ is an alias to /src
import Aside from '../components/Aside'
export default {
  name: 'Home',
  components: { Aside }
}
</script>
<style lang="less">
.home-container {
  height: 100%;
}

 

おすすめ

転載: blog.csdn.net/cmax007/article/details/106378574