我需要在一个长的13列表格中布局数据。但是它需要看起来像两个表格,第10列和第11列之间有一些空间。在HTML中如何做到这一点?我的第一个想法是一个14列的表格,第11列占用空间但不可见。我不知道如何做到这一点,虽然。
wwodge7n1#
如果您不希望表格单元格为空(这对于视力受损的人来说可能很奇怪),请尝试以下操作。
td { display: inline-block; background: pink; } td.spaced { margin-left: 20px; }
<table> <tr> <td>One</td> <td>Two</td> <td class="spaced">Three</td> </tr> </table>
ljsrvy3e2#
我认为这更像是一个CSS问题,但它可以很容易地用:nth-child完成。创建空的表格单元格作为第11列,并用途:
:nth-child
td:nth-child(11) { border: 0; }
http://jsfiddle.net/ExplosionPIlls/rZYRd/
ibrsph3r3#
试试这个例子,看看它是否符合你的喜好... 5列,在第2列和第4列之间有一个间隔。它可以改进,但我认为它已经得到了你想要的外观。
<table cols=5 style='border:thin solid blue'> <tr> <th style='border:thin solid blue'>Col 1</th> <th style='border:thin solid blue'>Col 2</th> <th> </th> <th style='border:thin solid blue'>Col 3</th> <th style='border:thin solid blue'>Col 4</th> </tr> <tr> <td style='border:thin solid blue'>Col 1A</th> <td style='border:thin solid blue'>Col 1B</th> <td> </th> <td style='border:thin solid blue'>Col 1D</th> <td style='border:thin solid blue'>Cell 1E</th> </tr> </table>
3条答案
按热度按时间wwodge7n1#
如果您不希望表格单元格为空(这对于视力受损的人来说可能很奇怪),请尝试以下操作。
ljsrvy3e2#
我认为这更像是一个CSS问题,但它可以很容易地用
:nth-child
完成。创建空的表格单元格作为第11列,并用途:http://jsfiddle.net/ExplosionPIlls/rZYRd/
ibrsph3r3#
试试这个例子,看看它是否符合你的喜好... 5列,在第2列和第4列之间有一个间隔。它可以改进,但我认为它已经得到了你想要的外观。