打印div工作但顶部jQuery有空格

Question

好的我正在构建发票申请，我正在尝试打印出包含发票的div。我有想法隐藏除了包含发票内容的div之外的所有div，然后打印该div。

喜欢这样：

  // on click of print button hide all div's except invoice and then force print
    $(document).ready(function() {
      $(document).on('click', '.print_button', function() {
        $('.print_invoice').css({width: '100%'}, {height: "100%"});
        $('.hide_this').hide();
        window.print();

        // return all hidden div's on invoice click
        $('.print_invoice').click(function() {
          $('.hide_this').show();
          $(this).css({width: '83.33333333%'},{height: '60%'});
        });
      });
    });

它工作得很好，只是在打印时它顶部有一个大的空格，因此它会强制页脚的一部分到第二页。

喜欢这样：

如何删除顶部的大空白并推开发票以使其适合一页？

Answer 1

您必须使用专用的CSS样式表进行打印：

https://www.smashingmagazine.com/2011/11/how-to-set-up-a-print-style-sheet/

你可以做一些重置。

Rememeber ：打印时禁用打印标题选项，这会有所帮助。