inline-block元素间4px间隙源于HTML解析器将换行符渲染为空格文本节点，宽度≈父容器font-size的0.25em；推荐父容器设font-size:0并重置子元素字号，或改用display:flex+gap彻底规避。
inline-block 元素间换行产生 4px 间隙怎么消
这不是 margin，也不是 padding，是 HTML 解析器把标签间的换行符当成了一个文本节点，再按 font-size 渲染出约 4px 的空白。静态写法里换行缩进越整齐，这间隙越稳定（也越烦人）。
推荐做法：
- 给父容器设
font-size: 0，再单独给子元素恢复字体大小，比如.container { font-size: 0; } .container > * { font-size: 16px; display: inline-block; } - 改用
display: flex+gap，彻底绕过文本节点问题，gap: 8px直接生效，不依赖源码格式 - 删掉 HTML 源码中所有换行和空格（如
<button>A</button><button>B</button>），但可读性差，仅适合构建工具自动处理
想让文字里多个空格原样显示，该用 还是 white-space
是单点控制，适合固定位置插 1–3 个不可折叠空格，比如「姓名： 张三」；但连写十个 不仅难维护，还会让语义混乱。
white-space: pre-wrap 更合理：保留源码中的空格、制表符和换行，又允许自动换行，且不强制等宽字体——比 <pre class="brush:php;toolbar:false;"></pre> 安全得多。
立即学习“前端免费学习笔记（深入）”；
生成可在 deepbi 沙箱 iframe 内运行或作为独立文件运行的交互式 HTML 页面，使用 `window.deepbi` JS SDK 实现数据查询、空间管理、文件浏览及用户操作。当用户提出以下需求时启用该能力： - 创建 KPI 仪表盘、数据表格、文件浏览器、成员列表、管理页面； - 明确要求“转成 dhtml”、“转译成 HTML”、“把 XX 页面转成……”、“控制台页面”、“管理后台”、“DeepBI 页面迁移”； - 提及位于 `apps/console/src/featur
注意别误用 white-space: nowrap，它会让图标+文字（如 ? 通知）粘成一块，因空格被保留但不换行，视觉上挤在一起。
letter-spacing 和 word-spacing 对中文空格有效吗
letter-spacing 对中文有效，它拉的是每个字（包括标点）之间的距离，设 letter-spacing: 2px 会让「联系我」变成「联 系 我」；但全局设负值（如 -1px）易导致小字号下汉字粘连，尤其在 Safari 移动端。
word-spacing 对纯中文基本无效，因为它只作用于“以空格分隔的单词”，而中文段落里没有空格分词。给 <p>联系我们</p> 设 word-spacing: 10px，什么都不会变；但若里面夹了邮箱 contact@example.com，反而会被撑开。
真正需要拉开汉字间距时，优先用 letter-spacing 单独包裹目标文字，别挂到 或 <p></p> 上。
表格单元格之间空隙为什么调不动
cellspacing 和 cellpadding 是 HTML5 废弃属性，不能写在 <td> 上，只能加在 <code><table> 标签里，而且无法分别控制横向/纵向间距，兼容性也差。<p>现代替代方案：</p>
<ul>
<li>用 <code>border-spacing: 8px 4px（需保持 border-collapse: separate），第一个值是横向，第二个是纵向
td, th { padding: 6px 12px; } 控制内容内边距，可单独给 th 加更大值做视觉区分border-collapse: collapse，此时 border-spacing 失效，空隙全靠 padding 控制最易被忽略的一点：空格问题从来不是“怎么多打几个空格”，而是“哪一层该由谁管”——文本内空格归 HTML 实体或 white-space，布局间隔归 CSS 的 margin/padding/gap，混用就会失控。
