HTML是一種用來展示網頁內容的語言。除了展示文本和圖片，HTML還能夠通過編寫代碼來實現物體在兩點間的運動。
<!DOCTYPE html>
<html>
<head>
<style>
#animate {
position: absolute;
left: 0;
top: 0;
width: 50px;
height: 50px;
background-color: red;
animation-name: example;
animation-duration: 4s;
animation-iteration-count: infinite;
}
@keyframes example {
0% {
left: 0;
top: 0;
}
50% {
left: 200px;
top: 50px;
}
100% {
left: 0;
top: 0;
}
}
</style>
</head>
<body>
<div id="animate"></div>
</body>
</html>在這個示例代碼中，我們首先給運動的物體設置了一個id為“animate”的div，并為它指定了紅色背景色和50x50的寬高。
然后，在樣式中，我們使用了CSS3的animation屬性來實現物體從左上角到右下角再回到左上角的運動。具體來說，我們設置了animation-name為“example”，表示使用名為“example”的動畫，animation-duration為4秒，表示這個動畫持續4秒鐘，animation-iteration-count為infinite，表示這個動畫無限循環播放。
在@keyframes中，我們設置了物體在動畫過程中不同時間點的位置。在0%時間點和100%時間點，物體位于左上角，而在50%時間點，物體位于右下角，并沿著對角線運動。
使用這種方法，我們可以通過編寫簡單的HTML和CSS代碼，輕松實現物體在兩點間的運動。讓我們一起開始親手嘗試吧！