HTML闭合标签在中文文本中产生多余空白的技术求助

我近期收到网页的繁体中文Word翻译版，译者已将内容转为HTML，但其中存在大量过时标签（如<font>）。当前需重点处理第二个带数字的表格及其后第三段内容的两个问题：

问题1：表格单元格内标签闭合后出现多余空白 #

表格第二列第二行的HTML代码如下：

<strong>Cr20000</strong>/<em><u>Cr20800</u></em>

这段代码会在</strong>闭合标签后产生多余空白，导致表格内数字无法正常右对齐。

问题2：段落括号内文本后出现多余空白 #

表格下方第三段末尾的代码如下：

(<span style="background-color: yellow;">&#34722;&#20809;&#24213;&#33394;</span>)

无论使用HTML实体还是直接输入Unicode/UTF-8字符，四个中文字符后都会出现多余空白，但左括号与第一个字符间无此问题。

解决方案建议 #

• 消除标签间的多余空白

  1. 确保标签与相邻字符紧密拼接，若代码格式化导致换行，可用HTML注释消除空白：

     <!-- 表格内代码优化 -->
     <strong>Cr20000</strong><!--
     -->/<em><u>Cr20800</u></em>
     <!-- 括号内代码优化 -->
     (<span style="background-color: yellow;">&#34722;&#20809;&#24213;&#33394;</span>)
     

  2. 给对应元素添加CSS样式white-space: nowrap;，强制文本不换行且不生成额外空白：

     td, .highlight-text {
       white-space: nowrap;
     }
     

• 修复表格数字右对齐
  给目标列的单元格添加CSS对齐样式，同时配合white-space避免空白干扰：

  td.numeric-cell {
    text-align: right;
    white-space: nowrap;
  }
  

• 排查父元素样式干扰
  检查包含这些元素的父标签是否设置了letter-spacing或word-spacing属性，若有则调整该属性值为normal，消除额外间距。

内容的提问来源于stack exchange，提问作者Jeff Zeitlin