在CSS中,如何让表格无间距呢?接下来让我们来详细了解。table{ border-collapse: collapse; } td, th{ padding: 0; margin: 0; } 上面的
在CSS中,如何让表格无间距呢?接下来让我们来详细了解。
table{ border-collapse: collapse; } td, th{ padding: 0; margin: 0; }
上面的代码中,我们用了border-collapse: collapse;
来让边框无间距,用了padding: 0;
和margin: 0;
来让单元格无间距。
下面是一个完整的例子:
<!DOCTYPE html> <html> <head> <style> table{ border-collapse: collapse; } td, th{ padding: 0; margin: 0; } </style> </head> <body> <table> <tr> <th>Header 1</th> <th>Header 2</th> <th>Header 3</th> </tr> <tr> <td>Cell 1</td> <td>Cell 2</td> <td>Cell 3</td> </tr> <tr> <td>Cell 4</td> <td>Cell 5</td> <td>Cell 6</td> </tr> </table> </body> </html>
代码中的border-collapse: collapse;
让表格的边框无间距,而padding: 0;
和margin: 0;
则让单元格的内外边距都为0,从而达到了无间距的效果。
至此,我们就已经成功让表格无间距了。
粉丝
0
关注
0
收藏
0