CSS高度自適應自動撐開是一個常見且實用的樣式，它可以根據內容自動調整元素的高度，使元素和其中的內容保持緊密結合，不會出現高度不足或溢出的問題。

我們可以使用CSS的偽元素before和after來實現高度自適應自動撐開。首先，我們需要將元素的height設置為0，并且overflow設置為hidden，然后再利用偽元素撐開元素的高度。

.element{
height: 0;
overflow: hidden;
}
.element::before,
.element::after{
content: "";
display: table;
}
.element::after{
clear: both;
}

在上面的代碼中，我們將元素的height設置為0，并且overflow設置為hidden。接著，我們使用偽元素before和after來撐開元素的高度。偽元素before和after的content屬性設置為空字符串，使它們不可見，并且display屬性設置為table，使它們具有包裹性，可以自適應撐開元素的高度。

同時，我們使用偽元素after來清除浮動，確保元素中的所有內容都被正確地包含在元素內部。

經過上面的設置，我們可以看到元素的高度已經被自適應地撐開，并且能夠完整地包含其中的內容了。

綜上所述，CSS高度自適應自動撐開是一個非常實用的樣式，它可以使我們的頁面更加美觀和易讀，避免了元素高度不足或溢出的問題。在編寫網頁時，我們應該充分利用它，讓我們的頁面更加完美。