在網頁設計中,很多時候我們需要將一個div
元素設置為全屏顯示,這可以通過設置div
的寬度和高度為 100% 來實現。
div { width: 100%; height: 100%; }
如果我們要將div
的背景圖片或顏色占滿全屏,就需要將body
和html
元素的高度也設置為 100%。
body, html { height: 100%; } div { width: 100%; height: 100%; background-image: url("bg.jpg"); background-size: cover; }
還有一種方法是使用vh
和vw
單位來設置div
的寬度和高度,它們表示視口高度和視口寬度的百分比。
div { width: 100vw; height: 100vh; }
無論使用哪種方法,都可以輕松實現div
的全屏顯示,讓網頁更具吸引力。
上一篇css中margin為負
下一篇css中main標記