HTML小球滾動是一種很有趣的效果，可以在網頁中增加一些趣味性和交互性，下面是一個使用HTML和CSS實現小球滾動的代碼實例。
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title>小球滾動</title>
<style>
#ball {
position: absolute; /*絕對定位*/
width: 50px;
height: 50px;
border-radius: 25px; /*設置為圓形*/
background-color: red;
animation: ball-roll 3s infinite; /*設置動畫*/
}
@keyframes ball-roll { /*定義動畫*/
0% {
left: 0; /*初始位置*/
}
100% {
left: calc(100% - 50px); /*滾動到最右側*/
}
}
</style>
</head>
<body>
<div id="ball"></div></body>
</html>這段代碼中，我們首先定義了一個id為"ball"的div元素，設置了其寬度、高度及圓角等屬性，然后使用CSS的animation屬性定義了一個名為"ball-roll"的動畫。在動畫中，我們指定了小球的初始位置為左側，最終位置為右側，同時將其無限次循環滾動。
下一篇vue for 卡