CSS單張圖片輪播是一種常用的網頁設計元素，它可以為網站增加視覺效果，提高用戶體驗。本文將介紹如何使用CSS實現單張圖片輪播。

HTML代碼：
<div class="slideshow">
<img src="img1.jpg" alt="圖片1">
<img src="img2.jpg" alt="圖片2">
<img src="img3.jpg" alt="圖片3">
</div>
CSS代碼：
.slideshow{
position: relative;
width: 100%;
height: 500px;
margin: 0 auto;
overflow: hidden;
}
.slideshow img{
position: absolute;
top: 0;
left: 0;
width: 100%;
height: 100%;
opacity: 0;
transition: opacity 0.5s ease-in-out;
}
.slideshow img:first-child{
opacity: 1;
}
.slideshow:hover img{
opacity: 0.5;
}
.slideshow:hover img:hover{
opacity: 1;
}

首先，在HTML中創建一個div元素，設置class為“slideshow”，并在其中添加需要輪播的圖片，如上述代碼所示。

接著，在CSS中為“slideshow”設置position為relative，width和height為需要的寬度和高度，margin為0 auto使圖片居中，overflow為hidden去掉多余的滾動條。

為圖片設置position為absolute，使它們能夠重疊在一起，并且設置top和left為0，width和height為100%，使其充滿整個div元素。

為了實現輪播效果，將第一張圖片的opacity屬性設置為1，其他圖片的opacity屬性設置為0。然后使用CSS3的屬性transition來使圖片漸變過渡，設置時間為0.5秒。

最后，當鼠標移動到圖片上時，將圖片的opacity屬性設置為0.5，而當鼠標經過圖片時，將圖片的opacity屬性設置為1，從而實現輪播效果。

以上就是使用CSS實現單張圖片輪播的方法，希望能夠幫助到大家。