javascript - 如何在 JavaScript 中将像素转换为打印英寸?

标签 javascript css printing

我想调整 SPAN 元素样式的字体大小,直到 SPAN 的文本打印在纸上时为 7.5 英寸宽,但 JavaScript 仅以像素为单位报告 SPAN 的 clientWidth 属性。

<span id="test">123456</span>

然后:

#test {
  font-size:1.2in; /* adjust this for yourself until printout measures 7.5in wide */
}

然后:

console.log(document.getElementById('test').clientWidth);

我在一台机器上通过实验确定它使用大约 90 DPI 作为转换因子,因为上面的代码记录大约 675,至少在 Firefox 3 下是这样。

这个数字在不同的浏览器、打印机、屏幕等配置下不一定相同。

那么,如何找到浏览器使用的 DPI?我可以调用什么来在我的系统上恢复“90”?

最佳答案

总结:

这不是您可以使用 HTML 解决的问题。除了CSS2 print properties , 浏览器打印东西没有定义或预期的方式。

首先,A pixel (in CSS) is not neccessarily the same size as a pixel (on your screen) ,因此某个值对您有用的事实并不意味着它会转化为其他设置。

其次,用户可以使用页面缩放等功能更改文本大小。

第三,由于没有明确的方式来布局用于打印目的的网页,因此每个浏览器的做法都不同。只需在 Firefox 和 IE 中打印预览一些东西,看看区别。

第四,打印带来了一大堆其他变量,例如打印机的 DPI、纸张尺寸。此外,大多数打印机驱动程序都支持用户缩放输出在打印对话框中设置,这是浏览器永远看不到的。

最后,很可能是因为打印不是 HTML 的目标,网络浏览器的“打印引擎”(在我见过的所有浏览器中)与其余部分断开连接。您的 javascript 无法与打印引擎“对话”,反之亦然,因此“浏览器用于打印预览的 DPI 编号”不会以任何方式公开。

我推荐一个 PDF 文件。

关于javascript - 如何在 JavaScript 中将像素转换为打印英寸?,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/159183/

相关文章:

javascript - 显示二维数组的坐标

javascript - 有没有办法异步进行跨域javascript调用?

Jquery 背景图像在 Safari 中不起作用

java - 如何一次性从Set中获取数据

javascript - bootstrap main.js 和 plugins.js 脚本有什么用?

javascript - Uint8Array.map(...) 意外行为

c - 在网络环境中从 Brother TD-4100N 打印机检索打印机状态

tensorflow - tensorflow 中的条件打印节点

javascript - 将鼠标悬停在图像上时 Bootstrap 4 弹出窗口

javascript - 显示我的页面何时加载的容器