HTML/CCS打印功能

Question

我正在创建一个网站，我想添加一个按钮来打印页面。我能够做到这一点，就像用ctrl+P打印一样，但结构都改变了，看起来很糟糕。

<div class="header-content">
     <h2 id="Feed">
          <button onclick="printFunction()">Imprimir</button>
          <script>function printFunction(){window.print();}</script>
     </h2>
</div>

有没有其他打印的方法？就像是一块打印屏幕

Answer 1

当打印网页时，页面会被重新渲染以适应页面，而不是截屏并打印出来。这允许开发人员创建自定义样式来帮助页面打印到纸张上，这与在屏幕上布局页面有本质上的不同。

有一种方法可以使用canvas获得与您想要的内容相似的内容，如下所示：Using HTML5/Canvas/JavaScript to take in-browser screenshots

使用工具：https://html2canvas.hertzen.com/

但它并不完美，我不相信不使用浏览器扩展就不可能获得完美的屏幕截图。