border-spacing 属性规定相邻单元格的边框间的距离(仅用于“边框分离”模式)。
table
{
border-collapse:separate;
border-spacing:10px 50px;
}
| 值 | 描述 |
|---|---|
| length length | 规定相邻单元的边框之间的距离。使用 px、cm 等单位。不允许使用负值。 |
| inherit | 指定应该从父元素继承border - spacing属性的值 |
HTML
<table class="ex1" border="1"> <tr> <td>Peter</td> <td>Griffin</td> </tr> <tr> <td>Lois</td> <td>Griffin</td> </tr> </table> <br> <table class="ex2" border="1"> <tr> <td>Cleveland</td> <td>Brown</td> </tr> <tr> <td>Glenn</td> <td>Quagmire</td> </tr> </table> <p><b>注意:</b>仅当 !DOCTYPE 已经定义时 IE8支持 border-spacing 属性</p>
CSS
table.ex1
{
border-collapse:separate;
border-spacing:10px;
}
table.ex2
{
border-collapse:separate;
border-spacing:10px 50px;
}
执行结果
| Peter | Griffin |
| Lois | Griffin |
| Cleveland | Brown |
| Glenn | Quagmire |
注意:仅当 !DOCTYPE 已经定义时 IE8支持 border-spacing 属性