如何在所有页面上打印带页眉和页脚的html页面?

时间:2017-12-06 08:47:29

标签: html css

当我试图打印html页面时,我想要一些帮助。我想在打印时在所有页面上都有页眉和页脚。

这是我目前的代码

<!DOCTYPE html>
<html>
  <head>
    <meta charset="utf-8">
    <meta name="viewport" content="width=device-width, initial-scale=1">
    <link rel="stylesheet" media="all" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/css/bootstrap.min.css">
    <script src="https://ajax.googleapis.com/ajax/libs/jquery/3.2.1/jquery.min.js"></script>
    <script src="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/js/bootstrap.min.js"></script>
  </head>
  <body>

    <style media="screen">
      .header{
        top: 0;
        width: 100%;
        height: 100px;
        height: 100px;
      }
      .content{

      }
      .footer{
        padding-top: 50px;
        width: 100%;
        height: 100px;
      }
    </style>

    <div class="header">
      header
    </div>

    <div class="content">
      <table>
        <tr><td>dfdsfsdfsdf start</td></tr>
        <tr><td>dfdsfsdfsdf</td></tr>
        <tr><td>dfdsfsdfsdf</td></tr>
        <tr><td>dfdsfsdfsdf end</td></tr>
        <!-- there will be around 1000 record of  <tr><td></td></tr>-->
      </table>
    </div>

    <div class="footer">
      footer
    </div>

  </body>
</html>

目前标题不在第二页,页脚转到第二页,第一页没有页脚。那么我怎么能这样做,使它看起来像银行对帐单或任何其他声明,每个页面上都有一个页眉和一个页脚,表中的值保留在每个页面的中间

Here is the image which i m getting currently Here is the image which i m getting currently

1 个答案:

答案 0 :(得分:0)

您可能只想将数据作为可下载的.pdf或.doc提供,并将该文件配置为在每个页面上都有页眉和页脚。这就是我的银行对我的陈述所做的事情。

我认为HTML5不支持您尝试做的事情。虽然这对HTML6来说很酷。