CSS填充頁面剩余高度是一種常見的技巧，可以幫助我們在頁面布局中使元素達到期望的位置和大小。本文將為大家介紹如何使用CSS填充頁面剩余高度的方法。

首先，我們需要了解兩個CSS屬性：height和min-height。

height：規定元素的高度。
min-height：規定元素的最小高度。

使用height屬性時，元素的高度將直接設置為指定值，不會根據內容和其他元素自動調整高度。而使用min-height屬性，則可以保證元素的高度在不會小于指定值的前提下，根據內容和其他元素自動調整高度。

因此，如果我們想要填充頁面剩余高度，可以將容器元素的height設置為100%，同時將內部元素的min-height設為100%，這樣，這個元素就可以在頁面上占據剩余的高度。

.container {
height: 100%;
}
.inner {
min-height: 100%;
}

上面的代碼會將.container元素設為占據整個頁面的高度，并將.inner元素設為至少與.container相同的高度，從而填充頁面上剩余的高度。

除了使用height和min-height屬性，我們還可以使用flex布局來實現填充頁面剩余高度的效果。flex布局通過設置容器元素的display為flex來啟用，并使用flex-grow屬性將元素的尺寸自動調整以填滿剩余的空間。

.container {
display: flex;
flex-direction: column;
}
.inner {
flex-grow: 1;
}

上面的代碼同樣能夠使.inner元素填充頁面剩余高度。

總結來說，使用CSS填充頁面剩余高度的方法主要有兩種：使用height和min-height屬性，以及使用flex布局。在實際項目中，我們可以根據實際情況選擇合適的方法來實現頁面布局效果。