在CSS中,我們可以使用背景顏色(background-color)和高度(height)屬性來美化網頁。但是如果不設置自適應屏幕,會導致在不同屏幕尺寸中顯示效果不同,影響用戶體驗。
/* 設置背景顏色 */ body { background-color: #f2f2f2; } /* 設置高度自適應屏幕 */ .wrapper { height: 100vh; }
上面的代碼演示了如何在CSS中設置背景顏色和高度自適應屏幕。通過設置body標簽的背景顏色,我們可以使整個頁面的背景色變為灰色(#f2f2f2)。接下來,我們可以使用.wrapper類來定義一個容器,在該容器中設置高度為100vh,即100%的視口高度,從而實現高度的自適應屏幕。
這種方法可以確保網頁在不同設備上顯示效果一致,使用戶在瀏覽網頁時獲得更好的體驗。此外,我們還可以通過CSS媒體查詢來控制不同屏幕尺寸的顯示效果,從而進一步優化網頁的布局。