在Web開發過程中，我們經常會遇到一種情況，就是需要將一個頁面的高度設置為當前屏幕的高度。這時候，我們可以使用CSS來實現這個效果。下面就讓我們一起來了解一下吧！

html, body {
height: 100%;
}
.main-container {
min-height: 100%;
}

首先，在HTML和Body元素中設置高度值為100%。這主要是為了保證子元素能夠繼承這個高度值。接下來，在主容器中，設置最小高度為100%。這樣，當頁面內容很少時，容器的高度就會自動擴展，達到100%的高度。

實際上，還有一種更加簡潔的方法。我們可以使用Viewport Units中的vh單位來設置高度值。vh單位是指視口高度的百分比，1vh等于視口高度的1%。因此，我們可以將主容器的高度設置為100vh，來達到和上面相同的效果。

.main-container {
height: 100vh;
}

這是一種更加簡單和直觀的方法，可以直接將元素的高度值設置為視口高度，無需再進行其他的計算。

總的來說，使用CSS設置頁面高度為當前屏幕高度有兩種常見的方法，即在HTML和Body元素中設置高度值，或者使用Viewport Units中的vh單位來直接設置元素高度。不過，在實際應用中，我們還需要考慮其他因素，如是否需要支持響應式布局、是否需要兼容舊版本的瀏覽器等等。因此，在具體應用中，我們需要根據實際情況來選擇最合適的方法。