簡單實現elementui的el-container布滿全屏

在使用elementui的布局元素的時候，會遇到一個問題，那就是照着官方文檔弄出來的布局元素不能實現滿屏。

 

 

很顯然，這不是我們想要的效果，我們要把它布滿全屏.

解決代碼如下

<style type="text/css">
/*
    找到html標簽、body標簽，和掛載的標簽
    都給他們統一設置樣式
*/
  html,body,#app,.el-container{
        /*設置內部填充為0，幾個布局元素之間沒有間距*/
        padding: 0px;
         /*外部間距也是如此設置*/
        margin: 0px;
        /*統一設置高度為100%*/
        height: 100%;
    }
</style>

如果是用VUE，那么在App.vue中加入

<style lang="scss">
html,body,#app{
  margin: 0;
  padding: 0;
  height:100%;
}
</style>

 

 這樣就滿屏顯示了。