最近有個(gè)項(xiàng)目需要寫一個(gè)web應(yīng)用，但是我前端基礎(chǔ)太差，以前用過vue，這就摸索著來把。由于寫一個(gè)單頁面應(yīng)用，頁面需要占滿全屏。就百度了方法,
用vue-cli安裝了工程之后
index.html 里設(shè)置css樣式:
? ? html,body{
? ? ? ? height:100%;
? ? ? ? width:100%;
????????border:hidden;
????????overflow:hidden;
????}
主App.vue里設(shè)置app_div的樣式：在已有#app中添加 height=100%? 和 width=100%，然后在Login里設(shè)置width=100%，height=100%，background-color： black
但是運(yùn)行之后會(huì)瀏覽器左邊和上面部分出現(xiàn)窄窄的留白，chrome按F12調(diào)試發(fā)現(xiàn)div.main 和html的長(zhǎng)寬是一樣的，這就很奇怪了。
然后注釋掉index.html里的隱藏滾動(dòng)條，發(fā)現(xiàn)html頁面內(nèi)容大小會(huì)超過瀏覽器大小而出現(xiàn)了滾動(dòng)條。猜測(cè)很有可能是內(nèi)部div沒對(duì)于body有居左居上而導(dǎo)致有留白。于是加上margin=0，padding=0，均無效，又加上border=hidden也無效
后面繼續(xù)搜索資料發(fā)現(xiàn)在div#app里加上
{
padding:0px;
margin:0px;
position:absolute;
top:0px;
left:0px;
width:100%;
height:100%;
border:hidden;
}
最后解決了留白問題
