<!DOCTYPE html>
<html>
<head>
<style>
table, th, td { border: 1px solid black;
}
#myTABLE { border-spacing: 2px;
animation: mymove 5s infinite;
}
@keyframes mymove { 50% {border-spacing: 20px;}}
</style>
</head>
<body>
<h1>border-spacing 的动画效果：</h1>
<p>逐渐将 border-spacing 属性从 2px 更改为 20px，然后再改回：<p>
<table id="myTABLE">
<tr>
<th>Name</th>
<th>Age</th>
</tr>
<tr>
<td>Emil</td>
<td>9</td>
</tr>
<tr>
<td>Tobias</td>
<td>7</td>
</tr>
<tr>
<td>Linus</td>
<td>2</td>
</tr>
</table>
<p><b>注释：</b>CSS 动画在 Internet Explorer 9 以及更早版本中不起作用。</p>
</body>
</html>