Question

我有一个用html和css编码的网页。网页的大小为A4页面（300dpi）= 2480 X 3508（PX）。

问题是，当我打印我的网页时，它以72 / 96dpi的分辨率打印并打印7页而不是1页，我希望打印机能以300dpi的分辨率打印我的网页。

CSS，HTML，JAVASCRIPT中的一些代码还是可以帮助我的东西？

感谢。

Answer 1

HTML / CSS是矢量图形。你有css测量单位“px”（它总是72ppi，因此可能有点误导）但它实际上并不是光栅图形 - 它应该被打印机软件视为矢量。如果您在72dpi中找到打印的行，文本等，您可以非常确定问题是您的打印机/渲染器软件。尝试使用其他浏览器或首先将其保存为PDF（我知道Chrome可以原生地执行此操作）。

然而因为CSS测量单位“px”是72ppi，所以光栅图形（= png，jpg和gif图像）总是被视为72ppi - 即使它们以另一种分辨率保存。但您可以通过调整图像大小来强制图像达到所需的分辨率。如果我的图片是5x5 centimeters（=2x2 inches），我需要将其保存为600x600px，但将其CSS宽度属性设置为144px（width*(72/300) ）使它在网站上看起来像5厘米。

如果将图像调整到适当的分辨率，您应该可以300dpi打印它而不会出现任何问题 - 特别是如果您首先将其保存为pdf。否则，它很可能是打印机/打印机软件。

请记住，网页不是打印，并且不能期望网页在屏幕和打印上看起来完全相同 - 这就是重点。如果这就是您要找的内容应该改为使用PDF。

Answer 2

不幸的是，网络分辨率为72 dpi。我相信这是浏览器中固有的设置。如果您调整浏览器的设置，或打印机的设置为＆＃34;适合页面＆＃34;打印时你可能会有一些成功。

Answer 3

我使用pdfkit做过类似的事情，但我认为它必须与python或更具体地一起使用，我与django一起使用，它对我来说很好用，并创建了300dpi pdf 试试这个

options = { 'page-size'：'Letter'， 'margin-top'：'0.75in'， 'margin-right'：'0.75in'， 'margin-bottom'：'0.75in'， 'margin-left'：'0.75in'， 'encoding'：“ UTF-8”， 'dpi'：'300'， 'custom-header'：[ （“接受编码”，“ gzip”） ] '曲奇饼'： [ （“ cookie-name1”，“ cookie-value1”），（“ cookie-name2”，“ cookie-value2”）， ]， '无轮廓'：无 }

pdfkit.from_url（'http://google.com'，'out.pdf'，options = options）

https://github.com/JazzCore/python-pdfkit/blob/master/README.rst

Answer 4

你可以像这样使用 CSS：

@media print {
    @page {
        size: 210mm 297mm;
    }
}

或使用 px：

@media print {
    @page {
        size: 2480px 3508px;
    }
}

https://developer.mozilla.org/en-US/docs/Web/CSS/@media#media_types

如何以300 dpi分辨率打印html页面

4 个答案: