💻前端小技巧 | 如何优雅调整表格（table）中的行间距？

发布时间：2025-03-18 00:02:16来源：网易

大家好！今天我们来聊聊如何让表格（table）看起来更清爽、更美观。如果你发现表格的行间距太密，看着不舒服，可以通过CSS轻松搞定！💡

首先，在HTML结构中，`` 是表格的行标签。虽然 `` 本身没有直接设置行间距的属性，但我们可以借助 CSS 来实现。例如：

```css

table {

border-collapse: separate; / 确保边框分开 /

border-spacing: 0 10px; / 设置行间距和列间距 /

}

```

或者直接对 `` 元素应用样式：

```css

tr {

line-height: 2; / 调整行高 /

}

```

通过这种方式，你可以轻松地让表格的每一行之间更加疏朗，提升阅读体验。✨ 如果你觉得还不够，还可以试试给 `` 添加 `padding` 或者 `margin`。

最后，记得检查不同浏览器的兼容性哦！💪 这样你的表格就能既专业又好看啦！🌟

标签：

免责声明：本答案或内容为用户上传，不代表本网观点。其原创性以及文中陈述文字和内容未经本站证实，对本文以及其中全部或者部分内容、文字的真实性、完整性、及时性本站不作任何保证或承诺，请读者仅作参考，并请自行核实相关内容。如遇侵权请及时联系本站删除。