CSS是網頁設計中最為重要的語言之一，它可以控制網頁的布局和樣式。在使用CSS的過程中，我們經常會遇到圖片超出DIV的問題。如果圖片太大或者DIV容器太小，圖片會超出DIV的邊界，影響美觀性和用戶體驗。

//以下是圖片不超過DIV的CSS代碼
div{
width: 300px; //設置DIV容器的寬度為300px
height: 200px; //設置DIV容器的高度為200px
overflow: hidden; //設置DIV容器溢出內容隱藏
}
img{
max-width: 100%; //設置圖片的最大寬度為100%
height: auto; //設置圖片高度自適應
}

通過以上CSS代碼，我們可以實現圖片不超過DIV。首先，我們需要設置DIV容器的寬度和高度，然后將溢出的內容隱藏。接著，通過設置圖片的最大寬度，使圖片充分利用DIV容器的空間。同時，設置圖片高度自適應，保證圖片的比例不變。

需要注意的是，以上CSS代碼只是一種實現方式，根據實際需求，我們可以根據具體情況進行調整。比如，如果希望圖片居中顯示，可以使用flex布局或text-align:center;進行調整。

總之，在使用CSS布局時，我們應該注重細節，確保網頁的美觀性和用戶體驗。以上就是關于CSS圖片不超過DIV的內容，希望對大家有所幫助。