CSS怎么自動換圖片呢？我們可以使用CSS3的新屬性：transition和background-image，結合JavaScript代碼輪播多張圖片。

/* CSS樣式 */
.slideshow {
width: 800px;
height: 400px;
margin 0 auto;
overflow: hidden;
}
.slideshow img {
width: 100%;
height: 100%;
object-fit: cover;
opacity: 0;
transition: opacity 1s ease-in-out;
}
.slideshow img.active {
opacity: 1;
}
/* JavaScript代碼 */
let slides = document.querySelectorAll('.slideshow img');
let currentSlide = 0;
function nextSlide() {
slides[currentSlide].className = '';
currentSlide = (currentSlide + 1) % slides.length;
slides[currentSlide].className = 'active';
}
let slideInterval = setInterval(nextSlide, 3000);

通過CSS樣式，我們定義了一個名為slideshow的容器，設置它的寬度、高度、居中對齊以及overflow:hidden來隱藏超出寬度和高度的內容，接著為圖片設置了寬度、高度和object-fit:cover來保持圖片比例不變并填充整個容器。初始時，圖片的opacity為0且transition為1s。

為了實現自動換圖片，我們編寫了JavaScript代碼：通過querySelectorAll方法選擇所有的圖片，將當前圖片的className設置為空，在下一張圖片中更新當前圖片，而后一個class為active，使得下一張圖片的opacity為1，從而實現了圖片輪播。

最后為了定時更換圖片，我們使用JavaScript的setInterval方法來制定輪播時間。以上就是CSS怎么自動換圖片的完整代碼。