HTML 生成的 MS Word 文档中不需要的方块

Question

我正在使用 this topic. After some adaptions it's working fine for me, except now I'm getting squares at each end of the header and footer see image here 中的代码从 HTML 创建一个 MS Word 文档。无法手动删除这些方块，我也看不到创建它们的原因。

要重现，只需创建一个 *.doc 文件，使用文本编辑器（如 notepad++ 或 VS Code）打开它并输入以下代码。之后用MS Word打开文件。

我希望你们能帮我去掉那些方块！

<html xmlns:v='urn:schemas-microsoft-com:vml' xmlns:o='urn:schemas-microsoft-com:office:office'
    xmlns:w='urn:schemas-microsoft-com:office:word' xmlns:m='http://schemas.microsoft.com/office/2004/12/omml'
    xmlns='http://www.w3.org/TR/REC-html40'>

<head>
    <meta charset='utf-8'/>
    <title></title>
    <style>
        @page {
            mso-page-orientation: portrait;
            margin: 1cm 1cm 1cm 1cm;
        }

        @page Section1 {
            mso-header-margin: 1cm;
            mso-footer-margin: 1cm;
            mso-header: h1;
            mso-footer: f1;
        }

        div.Section1 {
            page: Section1;
        }

        table.hdrftrtbl {
            margin: 0in 0in 0in 900in;
            width: 1px;
            height: 1px;
            overflow: hidden;
        }

        p.MsoHeadFoot,
        li.MsoHeadFoot,
        div.MsoHeadFoot,
        td.MsoHeadFoot {
            margin: 0;
            margin-bottom:1px;
            tab-stops: center 50% right 100%;
            font-size: 12.0pt;
        }
    </style>
</head>

<body>
    <br/>
    TODO: Actual content goes here

    <div class='Section1'>
        <table class='hdrftrtbl' border='0' cellspacing='0' cellpadding='0'>
            <tr>
                <!-- HEADER-tags -->
                <td class='MsoHeadFoot'>
                    <div style='mso-element:header' id='h1'>
                        <span style='mso-tab-count:2'>
                            <img src='logo.jpg' width="140" height="60">
                        </span>
                    </div>
                </td>
                <!-- end HEADER-tags -->
                <!-- FOOTER-tags -->
                <td class='MsoHeadFoot'>
                    <div style='mso-element:footer' id='f1'>
                        <span style='mso-tab-count:0'>&copy; company name</span>
                        <span style='mso-tab-count:1'>TODO: beginning from page 2</span>
                        <span style='mso-tab-count:1'></span>
                        page
                        <span style='mso-field-code:PAGE'></span>
                        of
                        <span style='mso-field-code:NUMPAGES'></span>
                    </div>
                </td>
                <!-- end FOOTER-tags -->
            </tr>
        </table>
    </div>
    
</body>

</html>

Answer 1

找到了。我必须为每个页眉和页脚添加另一个 <div> 块：

<div style='mso-element:header'>
  <p class='MsoHeader'>
    <span>&nbsp;<o:p></o:p></span>
  </p>
</div>

相应地

<div style='mso-element:footer'>
  <p class='MsoFooter'>
    <span>&nbsp;<o:p></o:p></span>
  </p>
</div>

显然 <o:p></o:p> 标签负责这些方块。

HTML 生成的 MS Word 文档中不需要的方块

unwanted squares in MS Word doc generated from HTML

html

ms-word