HTML表格怎么去掉默认间隙？样式初始化方法-html教程-PHP中文网

只设 cellspacing="0" 不够，必须配合 border-collapse: collapse 和显式清除 border，否则在高缩放、不同浏览器下仍会出现视觉缝隙或双线重叠。

html表格怎么去掉默认间隙？样式初始化方法

直接说结论：只设 cellspacing="0" 不够，必须配合 border-collapse: collapse 和显式清除 border，否则在高缩放、不同浏览器下仍会出现视觉缝隙或双线重叠。

为什么 `cellspacing="0"` 有时不管用

HTML 属性 cellspacing 在 HTML5 中已废弃，现代浏览器虽仍支持，但它只控制单元格“框外”的间距，不处理边框重叠导致的视觉双线问题。尤其当 <table> 和 <code><td> 都设置了 <code>border，且未合并时，相邻边框会并列渲染——1px + 1px 在非整数缩放下极易出现偏移、加粗或空隙。

cellspacing="0" 只影响单元格之间的“空白区域”，不干预边框本身
Firefox 默认给 <table> 加 <code>border，Chrome 可能不加，行为不一致
即使 cellspacing="0"，若没设 border-collapse，td 的右/下边框仍会和相邻 td 的左/上边框并存

`border-collapse: collapse` 是核心动作

这是真正解决间隙的 CSS 属性，它让相邻单元格边框“合并成一条线”，而不是各自独立绘制。但要注意：它只对有边框的表格生效，且需作用于 <table> 元素本身。<ul><li>必须写在 <code><table> 上，例如：<code>table { border-collapse: collapse; }

如果只对 td 设 border 而 table 没边框，collapse 仍有效；但如果 table 也有 border，建议统一控制来源
不要混用 border-collapse: separate（默认值）和 collapse，否则可能被继承或覆盖

必须显式清除所有边框和内边距

光靠 border-collapse 还不够——th、td 的默认 padding 会造成内容“撑开”单元格，看起来像有间隙；浏览器 UA 样式也可能悄悄加 border。

使用HTML,CSS,JavaScript开发Android应用程序英文文字pdf版附源文件

如果你了解HTML，CSS和JavaScript，您已经拥有所需的工具开发Android应用程序。本动手本书展示了如何使用这些开源web标准设计和建造，可适应任何Android设备的应用程序 - 无需使用Java。您将学习如何创建一个在您选择的平台的Android友好的网络应用程序，然后转换与自由PhoneGap框架到一个原生的Android应用程序。了解为什么设备无关的移动应用是未来的潮流，并开始构建应用程序，提供更

下载

统一重置：table, th, td { border: none; padding: 0; }
更稳妥写法（防 UA 干扰）：table { border-style: hidden; } —— hidden 优先级高于 none，能强制压制 Firefox 等的默认边框
cellpadding="0" 可以保留（兼容旧代码），但推荐用 CSS 控制：td, th { padding: 0; }
避免用 * { margin: 0; padding: 0; } 全局重置，它会影响表格外其他元素布局

容易被忽略的内部元素外边距

即使表格结构完全“无缝”，td 里塞了 <p></p> 或 <h3></h3>，它们自带的 margin 会把行高撑开，造成“行间空隙”——这不是表格本身的间隙，但视觉上一模一样。

检查 td 内部是否含块级元素；若有，加 td p, td h3 { margin: 0; }
或更通用：td > * { margin: 0; }（注意仅作用于直接子元素）
用浏览器开发者工具的“Computed”面板看实际生效的 margin 值，比猜更可靠

最简可行组合就三行 CSS：table { border-collapse: collapse; border-style: hidden; } td, th { border: none; padding: 0; }。别省略 border-style: hidden，它专治那些你找不到来源的默认边框。