Vue 最外层div未铺满整个页面的解决方法

Vue 最外层div未铺满整个页面的解决方法

组件内的最外层div未铺满整个页面的有效解决方法：使用全局的CSS样式

1.在src/css目录下新建全局CSS文件：global.scss

html,
body,
#app{
  height: 100%;
  margin: 0;
  padding: 0;
}

2.在App.vue中引入全局样式global.scss

<style>
  /*引入全局样式*/
  import './css/global.scss'
  /*引入全局样式*/
  
  #app {
  font-family: 'Avenir', Helvetica, Arial, sans-serif;
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
  text-align: center;
  color: #2c3e50;
  margin-top: 60px;
}
</style>

3.刷新页面，页面成功被铺满。