在網(wǎng)頁設(shè)計中，經(jīng)常需要元素與屏幕大小自適應(yīng)，其中一個重要的元素就是高度適應(yīng)屏幕。下面我們介紹如何使用CSS實現(xiàn)高度自適應(yīng)：

html, body {
height: 100%;
margin: 0;
padding: 0;
}
.container {
min-height: 100%;
height: auto !important;
height: 100%;
margin: 0 auto -100px; 
}
.footer, .push {
height: 100px; 
}

首先，我們需要設(shè)置html和body的高度都為100%，表示整個頁面的高度都與屏幕大小相同。然后，我們在容器元素（.container）中設(shè)置min-height為100%和height為auto !important，這表示容器元素的高度最小為100%且在內(nèi)容需要自動調(diào)整高度時會自動適應(yīng)，而!important則表示這個屬性比其他同名屬性的優(yōu)先級更高。

接著，我們設(shè)置.container的高度為100%和底部有100px的外邊距，這是為了防止底部固定區(qū)域（如頁面底部導(dǎo)航或版權(quán)信息）遮擋住內(nèi)容。最后，我們設(shè)置.footer和.push的高度都為100px，這是為了給容器元素留出一定的空間。

這樣，我們就實現(xiàn)了網(wǎng)頁元素高度自適應(yīng)屏幕大小的效果，使頁面看起來更加美觀、整潔、合理。