在網(wǎng)頁開發(fā)中，我們常常需要將一些模塊的高度設置為自適應，這時我們就需要使用CSS自動高度。下面讓我們來看看如何實現(xiàn)CSS自動高度。

.content {
width: 300px;
border: 1px solid #ddd;
}
.content p {
margin: 10px;
}

以上是一個簡單的CSS代碼，我們想要讓.content元素的高度隨著內(nèi)容的增長而自動改變。我們可以使用CSS中的“overflow:auto”屬性，將元素設置為自動滾動，并且增加一個包裹內(nèi)容的容器。代碼如下：

.wrapper {
width: 300px;
border: 1px solid #ddd;
overflow: auto;
}
.wrapper p {
margin: 10px;
}

在這里，我們將.wrapper元素設為自動滾動，同時，它的高度會自適應內(nèi)容的高度。當內(nèi)容超出wrapper的高度時，會自動添加滾動條，因此不必擔心未能完全顯示的內(nèi)容問題。

除了使用“overflow:auto”外，我們還可以使用Flexbox布局實現(xiàn)自動高度。我們可以使用Flexbox中的“flex-grow”屬性，來將元素的高度設置為自動適應。代碼如下：

.wrapper {
width: 300px;
border: 1px solid #ddd;
display: flex;
flex-wrap: wrap;
}
.wrapper p {
margin: 10px;
flex-grow: 1;
}

在這里，我們使用Flexbox布局，將.wrapper元素設為flex容器。同時，我們使用“flex-grow:1”屬性來將元素的高度設置為自動適應。借助Flexbox的強大功能，我們可以想要的方式來布局自己的網(wǎng)頁。

總之，無論使用何種方式，實現(xiàn)CSS自動高度都是十分簡單的。這能夠使我們的網(wǎng)頁更加靈活，更好地適應不同設備的分辨率和窗口大小。