letter-spacing: -4px 能消除 inline-block 间隙，是因为该间隙本质是换行/空格字符的文本渲染宽度，负值使其视觉收缩；但会压缩子元素内所有文字，引发中文字体模糊、缩放错位等副作用，治标不治本。
直接给父元素设 letter-spacing: -4px 能压掉内联块换行间隙，但这是个“治标不治本”的权宜之计，容易引发文本渲染异常，尤其在缩放、中文字体或输入框聚焦时。
为什么 letter-spacing 会“意外”消除间隙
内联块（display: inline-block）间的换行符/空格会被浏览器当作文本节点渲染，占据约 4px 宽度（取决于当前字体和 font-size）。而 letter-spacing 作用于整个行内格式化上下文，负值会让这些空白字符“收缩”，视觉上把间隙盖住。
- 该间隙本质是“空白字符的渲染宽度”，不是 margin 或 padding
-
letter-spacing: -4px的数值不固定——它依赖父元素的font-size和字体度量，比如font-size: 12px下可能只需 -2px，而 20px 下可能要 -6px - 副作用明显：子元素里所有文字（包括按钮文字、label、placeholder）都会被压缩，iOS Safari 中甚至可能触发重排错位
更稳妥的替代方案（按推荐顺序）
优先用语义清晰、无副作用的方法：
- 父容器设
font-size: 0，子元素单独恢复字号（如font-size: 14px）——空白字符变不可见，且不影响子元素文本渲染 - 移除 HTML 源码中的换行与空格（把
- 改用
display: flex或display: grid布局——现代布局天然规避该问题，且控制力更强 - 若必须保留 inline-block + 换行可读性，可用注释“吃掉”空白：
-->
前端入门到VUE实战笔记：立即使用
在学习笔记中，你将探索 前端 的入门与实战技巧！
