CSS实现打印网页自定义页眉页脚

打印网页时需设置自定义的页眉页脚,CSS没法直接设定;但可以利用table的特性,间接实现类似的效果:

实现效果

网页结构代码



  


  

页眉内容

可将thead>th作为一个顶部的div使用,随意按需求填放模块内容

页脚内容

可将tfoot>td作为一个顶部的div使用,随意按需求填放模块内容

利弊分析:

  • 利:
    • 可以自由设置内容样式,无太大限制(注意只用打印支持的CSS样式);
    • 将th/td当作div使用,不受table布局限制。
  • 弊:
    • 最后一页若内容较少,页脚会追在内容区后方,而不会处于页面最下端

你可能感兴趣的:(CSS实现打印网页自定义页眉页脚)