使用過nuxt的小伙伴們總是被各種問題所坑。
因為nuxt中我們直接操作的根div並不是真的根如圖：
這里多說一句，不管用什么框架，多用瀏覽器的開發者模式觀察，能解決很多問題。
可以看到div的樣式是是一個叫id叫__nuxt的，不是我們加上去的。
這里明確幾個概念，
height:100% 指的是相對於父元素的高度
html,body 是最根的元素，且默認高度不是100%
一般我們這么設置（因為一般自己定義的div就是緊鄰body的，body就是這個div的父元素）
html,body{height:100%}
.custom-page{height:100%}（這里這個樣式會應用在我們nuxt中page文件夾的下vue文件的根div）
如上設置nuxt中無效。因為page中我們自己寫的根div，並不是真的緊鄰body標簽的那一個。
因為通過開發者控制台我們已經知道了div的結構，所以正確的方式css這么寫，如果沒有成功，確保css沒有被其他css覆蓋。
html,
body,#__nuxt,#__layout,#__layout{
height: 100%;
margin: 0;//消除瀏覽器默認的margin，可以不加
padding: 0;//消除瀏覽器默認的padding，可以不加
}
.custom-page{
height: 100%;
}
還有一個簡單的方法不需要去管任何父元素
.custom-page{
height: 100vh;
}
單位vh：相對於視口的高度。視口被均分為100單位的vh。 css3的單位，兼容性問題請自行查閱vh的詳細信息。