CSS中的盒子模型是 Web 開發中非常重要的一部分。通過盒子模型，我們可以精確地布局 HTML 元素，并控制它們的樣式和位置。在 CSS 中，我們可以使用背景圖片為盒子添加一個美麗的外觀。然而，有時候我們會遇到一個問題：如何在 CSS 中讓圖片緊貼上一盒子。

/** CSS 中的盒子 **/
.box {
background-image: url('image.png');
background-repeat: no-repeat;
background-position: center center;
width: 300px;
height: 200px;
border: 1px solid #ccc;
}
/** 圖片緊貼上一盒子 **/
.box img {
display: block;
margin: 0 auto;
padding: 0;
max-width: 100%;
max-height: 100%;
}

讓圖片緊貼上一盒子的方法其實很簡單，我們只需要給圖片添加下面這些 CSS 屬性：

• display: block;把圖片設置成塊級元素，使其與其他元素分成兩行。
• margin: 0 auto;把圖片水平居中，讓其與盒子左右兩側緊貼。
• padding: 0;讓圖片與盒子的內邊距為 0，使其上下兩側緊貼。
• max-width: 100%;讓圖片的寬度最大不能超過盒子的寬度。
• max-height: 100%;讓圖片的高度最大不能超過盒子的高度。

這樣，我們就可以在 CSS 中輕松地讓圖片緊貼上一盒子了。如果你有其他的 CSS 相關問題，歡迎留言與我交流。