letter-spacing 应作用于纯文本容器（如 h1、p），避免用于 input、btn 等交互组件；单位必须用 em，优先采用 0.04em（正文）、0.08em（标题）；通过外部 css 文件在 bootstrap 后加载并用具体选择器覆盖，配合媒体查询实现响应式控制。
直接加 letter-spacing 就生效，但别往 .form-control 或 .btn 上硬套
Bootstrap 没封禁 letter-spacing，你写它就起作用，前提是目标元素是纯文本容器。问题常出在误用场景：比如给 <input class="form-control"> 直接设 letter-spacing: 0.1em，结果光标偏移、选区虚线错位——Safari 和旧版 Chrome 尤其明显；.btn 加了大间距后文字撑出按钮边界，又不换行。
- 优先作用于
<h1 class="text-center"></h1>、<p class="lead"></p>、<div class="card-title"> 这类纯文本容器 <li>避开 <code>.form-control、.btn、.badge等交互组件的 class 直接设置 - 若真要调输入框内文字间距，改用
font-feature-settings: "kern"+ 固定font-size和line-height更稳 - 正文统一推荐
letter-spacing: 0.04em - 标题可用
0.08em，品牌名若字号固定（如 24px）才考虑用1px - 英文主导区域（如
.navbar-nav .nav-link）单独设更小值：letter-spacing: 0.02em - 禁用负值对
<small></small>或.text-muted类——12px 下-0.02em已接近视觉粘连临界点 - 建独立 CSS 文件（如
custom-navbar.css），放在 Bootstrap CSS 引用之后 - 用具体选择器提升权重，例如：
.navbar-brand { letter-spacing: 0.06em; } - 需要响应式控制？用媒体查询：
@media (max-width: 991.98px) { .navbar-brand { letter-spacing: 0.04em; } } - 给图片加
align-middle类，或写vertical-align: middle - 图标尺寸和文字字号差异大时，用
height: 1.5rem; object-fit: contain;控制缩放 -
.navbar-brand默认有padding: 0.5rem 1rem，若只想要图标无边距，得显式覆盖：px-0 py-0
letter-spacing 单位必须用 em，别用 px
Bootstrap 的响应式字体（如 h1 { font-size: calc(1.375rem + 1.5vw) }）会让 px 单位的字间距失配：小屏时 1px 太重，大屏时又不够。而 em 是相对于当前字号的，能随缩放自动调整。
覆盖 Bootstrap 样式，别改源码，也别用内联 style
Bootstrap 官方 CSS 文件里几乎没定义 letter-spacing（除个别 demo 类），所以你自定义的规则只要加载顺序在它之后，就能干净覆盖。硬塞内联 style="letter-spacing: 0.05em" 会破坏可维护性，且无法响应断点变化。
中英文混排时，别忽略 .navbar-brand 内部图片对齐问题
.navbar-brand 若含 <img> + 文字，图片 baseline 默认对齐会导致视觉下沉，“左边空、右边挤”。这不是字间距问题，但容易被误判为间距异常。
