使用css實現圖片輪播的方法：1.創建img標簽，添加圖片；2.使用position屬性定位圖片，設置寬高；3.使用@keyframescarousel屬性設置圖片輪播；
使用css實現圖片輪播的方法
1.首先，在頁面中創建對個img標簽，并添加圖片；
<!DOCTYPE html><html>
<head>
<meta charset="utf-8" />
<style>
</style>
</head>
<body>
<img src="1.jpg">
<img src="2.jpg">
<img src="3.jpg">
</body>
</html>
2.圖片添加好后，在css中使用position屬性對圖片進行定位并設置寬高；
<!DOCTYPE html><html>
<head>
<meta charset="utf-8" />
<style>
img{
position:absolute;
width: 300px;
height: 100px;
}
</style>
</head>
<body>
<img src="1.jpg">
<img src="2.jpg">
<img src="3.jpg">
</body>
</html>
4.最后，圖片樣式設置好后，使用@keyframescarousel屬性設置圖片輪播即可；
<!DOCTYPE html><html>
<head>
<meta charset="utf-8" />
<style>
img{
position:absolute;
width: 300px;
height: 100px;
}
@keyframescarousel{
0%,33%{
left:0;
}33%,67%{
left:300px;
}67%,100%{
left:600px;
}
}
</style>
</head>
<body>
<img src="1.jpg">
<img src="2.jpg">
<img src="3.jpg">
</body>
</html>
