Javascript窗口打印页脚只打印页码

Question

在javascript window.print函数中，如何删除页脚中的url但仍包含页码？这是我的结果页面。我希望网址消失但页码保持不变，无论如何我能实现这一点吗？看来这段代码不起作用。

<style type="text/css" media="print">
@page {
    size: landscape; margin:0 0 10mm 0 ;float: none !important;
}

a {
   display: none;
}

Answer 1

通过使用CSS，您可以轻松实现这一目标。对于这个答案，我们不使用@page，这是一个纯CSS答案，但在FireFox 20+版本中工作。这是一个例子的链接。

CSS是：

#content {
    display: table;
}

#pageFooter {
    display: table-footer-group;
}

#pageFooter:after {
    counter-increment: page;
    content: counter(page);
}

HTML代码是：

<div id="content">
  <div id="pageFooter">Page </div>
  multi-page content here...
</div>

这样您就可以通过编辑#pageFooter的参数来自定义页码。

我的例子：

#pageFooter:after {
    counter-increment: page;
    content:"Page " counter(page);
    left: 0; 
    top: 100%;
    white-space: nowrap; 
    z-index: 20px;
    -moz-border-radius: 5px; 
    -moz-box-shadow: 0px 0px 4px #222;  
    background-image: -moz-linear-gradient(top, #eeeeee, #cccccc);  
    background-image: -moz-linear-gradient(top, #eeeeee, #cccccc);  
  }

希望这个技巧能帮到你。

总页数

您可以使用此

@page {
   @bottom-right {
    content: counter(page) " of " counter(pages);
   }
}