CSS是一種用于設計網頁外觀和排版的語言，其中有一個非常重要的特性是可以監聽body高度。在一些特定情況下，我們需要根據頁面內容的變化來動態地修改頁面布局。監聽body高度就是一種實現這一目標的有效方法。

下面我們來看一下具體的實現方式。首先，在CSS樣式表中定義一個名為“#wrapper”的div，用于包裹整個頁面內容：

#wrapper {
position: relative;
min-height: 100%;
}

然后，給body標簽添加如下樣式：

body {
height: 100%;
margin: 0;
padding: 0;
}

這會使得html和body元素的高度設置為屏幕高度，并將其余邊距和內邊距設置為零。接下來，我們可以通過監聽#iwrapper中的偽類“::after”，來監測頁面高度的變化：

#wrapper::after {
content: "";
display: block;
height: 0;
clear: both;
visibility: hidden;
}

這里，我們將偽類“::after”的高度設置為零并隱藏該元素，用于檢測頁面元素高度的變化。有變化時，可以通過使用JavaScript動態地更新頁面布局。

綜上所述，CSS可以通過監聽body高度實現動態修改頁面布局的目的。通過定義包容整個頁面的DIV元素及其偽類，可以有效地監測頁面變化，并配合JavaScript動態地更新頁面布局，實現更好的用戶體驗。