在網頁設計中，經常需要元素與屏幕大小自適應，其中一個重要的元素就是高度適應屏幕。下面我們介紹如何使用CSS實現高度自適應：

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; 
}

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

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

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