与普通空格宽度不一致？如何创建等宽非断空格？

这个问题其实是Bitstream Vera Sans/Serif字体本身的设计特性导致的——该系列字体里，非断空格（ ，对应Unicode U+00A0）的宽度被刻意设计成和普通空格（U+0020）不同，而Noto Sans UI或DejaVu Serif这类字体则将二者宽度统一了，所以你切换字体后就看不到问题了。

下面给你几个实用的解决办法，按简单程度排序：

1. 用包裹普通空格的span替代  #

这是最直接的方案，不需要修改字体或复杂CSS：
把原来的 替换成：

<span style="white-space: nowrap;"> </span>

这个span里的普通空格和正常空格宽度完全一致，同时white-space: nowrap保证它不会被换行断开，完美实现你要的“非断+同宽”效果。如果需要复用，可以给这个span加个类：

.nbsp {
  white-space: nowrap;
}

之后用<span class="nbsp"> </span>即可，维护起来更方便。

2. 修改Bitstream Vera字体的字形（进阶） #

如果你必须用 这个字符本身，可以手动修改字体，让U+00A0的字形和U+0020一致：

• 用字体编辑工具（比如FontForge）打开系统里的Bitstream Vera字体文件
• 找到U+00A0的字形，直接复制U+0020的字形替换它
• 保存修改后的字体，重新安装到系统中
• 重启Firefox后， 就会和普通空格宽度一致了

注意：修改系统字体前最好备份原文件，避免影响其他应用。

3. 用CSS字体覆盖（半进阶） #

如果不想修改系统字体，可以用CSS的@font-face自定义字体加载规则，只针对U+00A0字符调整显示：

@font-face {
  font-family: "Vera Sans Fixed NBSP";
  src: local("Bitstream Vera Sans");
  /* 只针对非断空格字符应用这个规则 */
  unicode-range: U+00A0;
  /* 关闭字距调整，强制U+00A0匹配普通空格宽度 */
  font-feature-settings: "kern" off;
}

body {
  font-family: "Vera Sans Fixed NBSP", "Bitstream Vera Sans", sans-serif;
}

不过这个方法的浏览器兼容性不如前两种，建议优先用前两个方案。

内容的提问来源于stack exchange，提问作者René Nyffenegger