在html中为Chrome、Explorer和word创建分页符

在html中为Chrome、Explorer和word创建分页符,html,css,printing,ms-word,Html,Css,Printing,Ms Word,我似乎找不到一个一致的方法来创建一个可以跨word、internet explorer和chrome工作的分页符 以下示例(来自)将为Chrome和Internet explorer正确创建分页符,但word中没有分页符 <head> <meta http-equiv="content-type" content="text/html;charset=UTF-8" /> <title>Paginated HTML</title

我似乎找不到一个一致的方法来创建一个可以跨word、internet explorer和chrome工作的分页符

以下示例(来自)将为Chrome和Internet explorer正确创建分页符,但word中没有分页符

      <head>
    <meta http-equiv="content-type" content="text/html;charset=UTF-8" />
    <title>Paginated HTML</title>
    <style type="text/css" media="print">
      div.page
      {
        page-break-after: always;
        page-break-inside: avoid;
      }
    </style>
  </head>
  <body>
    <div class="page">
      <h1>This is Page 1</h1>
    </div>
    <div class="page">
      <h1>This is Page 2</h1>
    </div>
    <div class="page">
      <h1>This is Page 3</h1>
    </div>
  </body>

分页HTML
第页
{
分页符后:始终;
内部分页符:避免;
}
这是第一页
这是第2页
这是第3页
在搞乱word之后,我发现您可以让word添加以下分页符:

<br style="ms-special-character:line-break;page-break-before:always" />

这里的问题是,internet explorer也将其视为分页符,因此,如果您结合使用这些方法,Chrome和Word会正确地分页符,但internet explorer会插入两个分页符。如果您只使用一个浏览器,则chrome和explorer都是正确的,word则不是,依此类推。

尝试以下方法:

<!--[if IE]>
<br>
<![endif]-->
<!--[if !IE]>
<br style="ms-special-character:line-break;page-break-before:always" />
<br>
<![endif]-->

这符合你的需要吗?
(注意,这些都是用普通的旧html编写的。我用Chrome和MS Word(以及IE)进行了测试,效果很好。)

把相关的CSS放进去!有条件的评论。其他一切都可以保持原样

<style type="text/css" media="print">
<!--[if !IE]>
      div.page
      {
        page-break-after: always;
        page-break-inside: avoid;
      }
<![endif]-->
   </style>


Explorer将
标记之间的所有内容都视为注释,Word不会对此作出反应。所有其他浏览器将一如既往地显示

这是IE8和IE9之间的区别(前提是IE9处于标准模式),因此您需要以某种方式区分这些浏览器-或者使用条件注释,或者使用CSS黑客,例如:

div.page:not(.dummy)
{
    page-break-after: always;
    page-break-inside: avoid;
}
(在Chrome、Firefox、OpenOffice Writer[有望成为Word的适当替代品]和IE 7,8,9中测试)

为了防止浏览器同时在br上应用分页符并理解:不,您可以添加此选项,尽管我不知道有任何浏览器需要此选项:

br:not(.dummy)
{
    page-break-before: auto;
}

我知道这样的帖子会让我付出代价,但是,说真的,退后一步,重新考虑一下你想要实现的目标

可以使用Word查看和打印您的报告的用户也可以使用IE,并且很可能可以轻松访问Chrome。所以我猜Word不仅仅用于查看和打印,尤其是用于编辑

我遵循了您的示例,我的IE9(在各个方面都没有修改)不会打印使用Word 2010插入的分页符,并且生成的HTML文档与初始文档几乎没有任何相似之处,尤其是div已经消失,因此假设文档在Word发言后仍然打印相同的内容,这几乎是不经意的乐观

整个想法似乎都被打破了:

  • 考虑到Word对HTML的处理方式,按您的方式编写HTML似乎毫无意义
  • 即使是最近的IE也无法处理使用Word插入分页符的简单示例
  • 在保存Word时,它创建了一个特定于语言设置的目录和三个新文件,这会为任何产品产生大量的必要测试
  • 即使在静态Microsoft生态系统中,也需要大量的用户知识(生成目录、如何正确保存、如何正确复制整个文档)才能使此功能正常工作
  • 似乎用户定义的设置可以轻松打破任何使用HTML的解决方案

我建议你先把报告写成Word文档。即使经过压缩,Word文档仍然是类似HTML的标记,所以如果您已经可以生成HTML,那么只需很少的额外工作就可以生成Word。实际上,您可以为每一台x86或基于ARM的设备获取Word查看器,这似乎比探索一个即使是简单示例也失败的方向更合理。

还有一个可能对处理此类问题的某些人有用的补充:更改仅适用于块元素。在我们以前的测试中,有人使用“span”对块进行编码。我进行了多次测试,无法使Vreality的解决方案正常工作。然后我想可能是因为span不是块元素,所以在默认情况下不是块元素的元素中添加“display:block”


另一件事:我正在使用最新的Chrome(v.25),似乎不再需要“内部分页符:避免;”修复

这不是一个真正的解决方案,因为我们正在生成一个静态html页面(作为报告),用户可以随身携带并在任何浏览器或word中打开该页面。@MatthewSanford,您不能生成一个在特定程序中始终打开的文件类型吗?像pdf一样?不,我们需要它是可编辑的(即word),但我们需要它在任何机器上都可以查看。@MatthewSanford你能解释一下为什么这个解决方案并不完美吗?它似乎是便携式的、健壮的(与所有其他ie补丁没有什么不同)是的,用Word编写报告既棘手又脆弱。:-)对于我希望以相同方式显示的文档,无论用户当前在哪个平台上,我使用的格式正是为此目的而发明的<代码>我目前处于类似的情况,必须为马修辩护。没有一个头脑正常的开发人员会在没有很好的理由的情况下自愿选择这样一个棘手而脆弱的解决方案。对我们来说,这些原因是:(1)能够在运行任何操作系统的任何计算机上打开软件创建的文档,而无需安装任何软件(这会导致将HTML作为文件格式),(2)与针对MS Word的旧版本软件的用户体验保持一致;(3)让精通文本处理的用户有机会向文档中添加个人数据。