CSS是網頁設計中必不可少的一環，其中div是最基礎的布局元素之一，但如何讓div元素自適應呢？下面來介紹一些方法。

/* 設置div的寬度為百分比，利用盒子模型自動計算padding和border寬度，實現自適應 */
.div{
width: 80%;
padding: 10px;
border: 1px solid #ccc;
}

上面的代碼將div的寬度設置為80%，即占據容器寬度的80%。在div中設置了10px的內邊距和1px的邊框，這些寬度都會自動被計算在內，實現了自適應。

/* 采用flex布局，設置flex-grow屬性為1，實現寬度自適應 */
.container{
display: flex;
}
.div{
flex-grow: 1;
padding: 10px;
border: 1px solid #ccc;
}

上面的代碼采用了flex布局，將div元素的flex-grow屬性設置為1，表示會占據剩余的全部寬度。

/* 外層容器設置為position:relative，內部元素設置為position:absolute和width:100%，實現自適應 */
.container{
position: relative;
height: 200px;
border: 1px solid #ccc;
}
.div{
position: absolute;
top: 0;
bottom: 0;
left: 0;
right: 0;
padding: 10px;
}

上面的代碼則是采用了position絕對定位的方法來實現自適應。外層容器要設置為position:relative，內部元素設置為position:absolute和width:100%，表示占據全部寬度。

以上是div自適應的幾種方法，可以根據實際情況選擇適合自己的方案。