用letter-spacing: 0.1em拉开字距最直接；零宽空格实现可换行分隔；span包裹单字加margin最可控，需注意vertical-align和line-height以避免错位。
HTML <td> 里两个汉字强制分开显示
<p>默认情况下，浏览器不会在两个汉字之间断行或插入空隙——<code><td> 的文本流会把它们当做一个连续字块渲染。想“分开”，本质是控制字符间距或插入可换行/可伸缩的间隙。
<h3>用 <code>letter-spacing 拉开字距（最直接）
适用于视觉上“拉开距离”，不改变语义和换行行为。注意：它作用于所有字符（包括标点），且单位太小可能无效。
常见错误现象：letter-spacing: 1px 在小字号下几乎看不出效果；设成负值反而让字粘连更紧。
- 推荐从
letter-spacing: 0.1em起调（相对字体大小，更稳定） - 配合
display: inline-block或white-space: pre可避免表格单元格自动压缩 - 不要对整张表设全局
letter-spacing，否则数字、英文、符号全受影响
用零宽空格 实现“可换行但不可见”的分隔
适合需要响应式断行的场景（比如窄屏下，“你好”想在“你”后换行）。它不占空间，但浏览器视作合法换行点。
立即学习“前端免费学习笔记（深入）”；
Gridster.js多列网格式拖动布局插件
下载
网页中拖动 DIV 是很常见的操作，今天就分享给大家一个 jQuery 多列网格拖动布局插件，和其它的插件不太一样的地方在于你处理拖放的元素支持不同大小，并且支持多列的网格布局，它们会自动的根据位置自己排序和调整。非常适合你开发具有创意的应用。这个插件可以帮助你将任何的 HTML 元素转换为网格组件
使用场景：表格列宽受限，又不想用 <br> 硬换行破坏语义。
- 写法：
<td>你好</td> - 比
- 注意别误写成
（零宽非连接符），它禁止断行，适得其反
用 <span></span> 包裹单字 + margin 控制间距（最可控）
当需要精确控制每个字的位置、颜色、甚至动画时，这是唯一可靠方式。代价是 HTML 结构变重。
容易踩的坑：表格单元格默认 vertical-align: middle，但 <span></span> 是内联元素，若加 margin-top 可能导致整体错位。
- 正确写法：
<td> <span>你</span><span style="margin: 0 4px"></span><span>好</span> </td> - 更稳妥的做法是统一设
line-height和vertical-align: top防止基线偏移 - 如果要兼容 IE8，避免用
rem或ch单位，改用px或em
真正麻烦的不是怎么分开，而是分开之后要不要响应式重排、要不要支持复制粘贴、要不要保持语义可读性——这些决定了你该选 还是 <span></span>，而不是凭感觉试一个 CSS 属性就完事。
