移动端letter-spacing需用em单位（如-0.025em）并仅作用于纯文本容器，禁用于input/button；中英文混排应单独包裹英文设间距，且须同步调整line-height防视觉拥挤。
移动端文字挤成一团，letter-spacing 加了没反应？
不是 letter-spacing 失效，而是你可能直接用了 px 单位，或加在了 .form-control、.btn 这类交互组件上。小屏下字体缩放后，1px 间距会相对过大或过小；而表单控件内部渲染机制（尤其 Safari）会让光标、选区错位，看起来像“没生效”。
- 优先只作用于纯文本容器：
<h2>、<p class="lead">、<div class="card-title"> - 单位必须用
em：比如letter-spacing: -0.025em，它会随当前font-size等比缩放 - 别给
<input>或<button>直接设letter-spacing—— 改用font-feature-settings: "kern"配合固定font-size更稳
想让小屏紧、大屏松，但 text-spacing-sm 类根本不存在
Bootstrap 5.x 官方没提供任何以 text-spacing 开头的工具类，浏览器也不认识这个属性名。真正起作用的是 CSS 的 letter-spacing，响应式控制必须靠媒体查询或自定义 SCSS。
- 用 CDN 无编译环境？直接写
<style>：
@media (max-width: 575.98px) {
.ls-mobile-tight { letter-spacing: -0.02em; }
}
@media (min-width: 576px) and (max-width: 767.98px) {
.ls-tablet-normal { letter-spacing: 0; }
}
@media (min-width: 768px) {
.ls-desktop-wide { letter-spacing: 0.04em; }
}
- 用 SCSS 源码？在
_custom.scss里循环生成断点类，编译后就能写<p class="ls-mobile-tight ls-desktop-wide"> - 别试图用
text-center或fw-bold“凑”字间距效果——它们和letter-spacing完全无关
中英文混排时字距忽紧忽松，怎么稳住？
中文字符本身没有字距调整需求，但英文单词、数字、标点在小屏下容易因字号压缩而粘连。单纯加大 letter-spacing 又会让中文“散架”，关键在于区分处理。
- 对纯英文/数字内容单独包裹：
<span class="ls-en">API v2.1</span>，再为.ls-en设letter-spacing: 0.03em - 避免全局设负值：
letter-spacing: -0.05em在小屏下极易让中文字形重叠，肉眼可见糊在一起 - 如果叠加了
text-stroke（描边），必须减小letter-spacing补偿描边带来的视觉膨胀
为什么加了响应式类，手机上看还是挤？
最常被忽略的一点：字间距变化后，line-height 和 font-size 没同步调。小屏下 letter-spacing 缩紧，若 line-height 还是默认的 1.5，行距撑开反而让文字纵向“浮”起来，加剧视觉拥挤感。
- 搭配使用
lh-sm（line-height: 1.25）或自定义line-height: 1.3，让纵向节奏匹配横向收紧 - 检查是否误用了
!important强制覆盖 Bootstrap 默认line-height—— 这会破坏后续所有基于行高的垂直居中逻辑 - 真要协同控制三者（字距、行高、对齐），建议放弃堆砌 utility class，改用 CSS 自定义属性 + 媒体查询统一管理
