如何修复docx转HTML后有序列表序号与文本间多余空白问题

问题成因 #

该问题是Word导出HTML时自动生成的Office专有Mso样式导致的：导出逻辑会默认给列表项配置超大的列表标记占位宽度、异常文本缩进规则，还会错误给部分列表项添加居中对齐属性，最终造成序号和文本之间出现大量无意义空白。

修复方案 #

单段列表快速修复 #

直接修改对应列表标签的行内样式，清除错误属性，配置常规缩进间隔即可，修复后的代码参考：

<ol style='margin-top:0cm; padding-left: 24px;' start=1 type=1>
 <li class=MsoNormal style='margin-right:2.15pt;text-align:left; text-indent: 0; padding-left: 4px;'><b><span
     style='font-size:12.0pt;letter-spacing:-.3pt'>Предмет договора.</span></b></li>
</ol>

全局批量修复 #

如果页面内存在大量同类异常列表，直接在页面头部的<style>标签中添加以下全局CSS，一次性覆盖所有Word导出的错误列表样式：

/* 重置列表基础缩进 */
ol, ul {
  padding-left: 24px;
}
/* 清除列表项错误缩进、对齐属性，配置序号与文本的常规间隔 */
ol li, ul li {
  text-indent: 0;
  text-align: left;
  padding-left: 4px;
  margin: 0;
}
/* 屏蔽Mso专有列表样式的干扰 */
li.MsoNormal {
  mso-list: none !important;
}

提示：如果需要调整间隔大小，只需微调ol的padding-left（控制整个列表距页面左侧的距离）和li的padding-left（控制序号与文本的间距）数值即可，数值越小间距越紧凑。

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