1 <!DOCTYPE html> 2 <html lang="en"> 3 <head> 4 <meta charset="UTF-8"> 5 <title>Document</title> 6 <style type="text/css"> 7 .box{ 8 width: 100px; 9 height: 100px; 10 background-color: gold; 11 transition: all 0.5s ease 0s; /* 同時加入動畫效果 */ 12 } 13 14 .box:hover{ 15 /* transform位移比定位位移的性能更高，因為其不影響整體布局，建議使用transform位移 */ 16 transform: translate(100px,100px); /* 設置位移 */ 17 } 18 </style> 19 </head> 20 <body> 21 <div class="box"></div> 22 </body> 23 </html>