CSS可以幫我們實現圖片的適配寬高，讓網頁更加美觀。下面是兩種常用的實現方法：

/* 方法一：利用background-size屬性 */
.img1 {
background-image: url("XXX.jpg");
background-size: 100% 100%;
width: 100%;
height: 0;
padding-top: 66.67%; /* 圖片高寬比例為3:2時，設為2/3即可 */
}
/* 方法二：利用object-fit屬性 */
.img2 {
width: 100%;
height: 200px;
object-fit: cover; /* 填滿容器，可能會裁剪 */
/* 或者使用 object-fit: contain; 等比縮放，圖片不會被裁剪 */
}

其中，方法一使用了background-size屬性，這個屬性可以讓背景圖像適配其所在元素的大小。在這個方法中，我們設置了元素的高度為0，通過padding-top屬性設置了高度與寬度的比例，這樣即可實現圖片的適配。

方法二使用了object-fit屬性，這個屬性可以讓元素的內容（圖片）適配其自身的大小。這個方法可以讓我們更加靈活地控制圖片的大小，而不需要過多考慮其高寬比例。