基本佈局是頁腳標籤違抗分配行爲
<body>
<div class="wrapper">
<nav></nav>
<myContent></myContent>
</div>
</body>
<footer></footer>
凡軀應該放棄的身體下面,而不是由機構或其子女的CSS的影響。
我的目標是讓頁腳位於頁面的底部,而不管頁面內容包含多少或多少內容。這個CSS應該是訣竅:
body, html {
height: 100vh;
}
.wrapper {
min-height: 96vh;
position: relative;
}
footer {
width: 100%;
height: 4vh;
position: relative;
bottom: 0;
font-size: .75em;
}
在我的瀏覽器檢查中,頁腳包含在body標籤中。這沒有意義。此外,頁腳顯示其寬度與視口相同,但不反映演示模型中的寬度。相反,它的左邊框位於頁面的左側,在右側有大約10%的空白區域。設置backround-color: yellow
證實了這一點。最後,除非<myContent>
將其推到屏幕視圖的下方,否則該位置將無法進入底部。
這個設置有什麼問題?