在网页设计中，经常需要元素与屏幕大小自适应，其中一个重要的元素就是高度适应屏幕。下面我们介绍如何使用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，这是为了给容器元素留出一定的空间。

这样，我们就实现了网页元素高度自适应屏幕大小的效果，使页面看起来更加美观、整洁、合理。