如何通过javascript访问屏幕显示的DPI设置？ [英] How to access screen display’s DPI settings via javascript?
问题描述
有没有办法在Javascript函数中访问屏幕显示的DPI设置？
Is there a way to access the screen display's DPI settings in a Javascript function?
我正在尝试在页面上定位HTML面板以及用户的DPI设置为大（120），它将关闭位置。我需要能够知道DPI是什么，所以我可以相应地调整位置。
I am trying to position a HTML panel on the page and when the user's DPI is set to large (120), it throws the position off. I need to be able to know what the DPI is so I can adjust the position accordingly.
推荐答案
首先，要帮助可能（并且非常常见）与术语DPI（每英寸点数）混淆：
Firstly, to help with the possible (and very common) confusion with the term DPI (dots per inch):
DPI不完全是显示设置的一部分。它（错误）用于两种不同的上下文：
DPI isn't exactly a part of "display settings". It's (mis)used in two different contexts:
- 显示器（或视频）每英寸的原始像素数。它决定了像素的小小。您可以在14英寸笔记本电脑屏幕和17英寸液晶显示器上使用相同的1024x768分辨率。前者约为1280/14 = 91 DPI，后者约为1280/17 = 75 DPI。屏幕的DPI是不可变的;它无法通过显示设置进行更改。 更多......
- 每英寸点数在打印过程中画在纸上。这是打印机/复印机/传真机可以在一英寸纸张内打印的并排点数。大多数打印机可以设置为以较低的DPI打印，只需将每个点打印为两个，四个等点。 更多......
- The native pixels per inch of a display (or video). It determines how small the pixels are. You can have the same 1024x768 resolution on both a 14" laptop screen and a 17" LCD monitor. The former would roughly be 1280/14 = 91 DPI and the latter would roughly be 1280/17 = 75 DPI. The DPI of a screen is immutable; it can't be changed with display settings. More...
- The dots per inch painted on paper during printing. This is the number of side-by-side dots a printer/photocopier/fax machine can imprint within an inch of paper. Most printers can be set to print at a lower DPI, by just printing each dot as two, four, etc. dots. More...
打印图像时，有很多因素影响纸张图像的最终尺寸：
When printing an image, there are many things that affect the final dimensions of the image on paper:
- 源图像的尺寸 - 这是像素或数据的数量。
- 源图像的DPI。此值确定打印图像时应如何解释尺寸。
- 如果源图像没有嵌入的DPI信息（JPEG可以有一个，GIF从不这样做），正在使用的程序可能具有指定DPI的设置。这可能是图像查看器/编辑器甚至是Web浏览器。
- 通常在打印对话框中指定的缩放系数。
- 当前DPI设置打印机。
- 打印机的物理（最大）DPI。
- The dimensions of the source image -- this is the amount of pixels or data there is.
- The DPI of the source image. This value determines how the dimensions should be interpreted when printing the image.
- If the source image doesn't have embedded DPI information (a JPEG can have one, a GIF never does), the program that's being used may have settings to specify a DPI. This could be an image viewer/editor or even a web browser.
- The zoom factor that's typically specified in a print dialog.
- The current DPI setting of the printer.
- The physical (max) DPI of the printer.
底线是，您正在打印的图像将被有效地重新采样（缩小或放大）以匹配打印过程中使用的最终DPI。任何被调用方都可能导致此问题（程序，打印驱动程序，打印机）。
The bottom line is, the image that you're printing will effectively get resampled (reduced or enlarged) to match the final DPI that's used in the print process. Any of the parties involed may be causing this (the program, the print driver, the printer).
现在，回到您的问题。不，您无法确定屏幕的DPI，因为它不在软件域中。这是一个硬件领域术语，描述用户可以买得多的监视器。 更新：我最初在2009年写了这个答案，我对当前的技术有所了解。正如@thure指出的那样，您现在可以（自2012年起？）使用窗口.matchMedia 用于确定屏幕的DPI。
Now, coming back to your question. No, you can't determine the DPI of the screen, because it's not in software domain. It's a hardware domain term, describing how large a monitor a user could afford to buy. Update: I initially wrote this answer back in 2009, with my understanding of the current technologies. As @thure pointed out, you can now (since 2012?) use the window.matchMedia function to determine the DPI of the screen.
如果您正在努力实现打印HTML布局的精确度，正如其他人所建议的那样， CSS应该使用像em，pt或pc这样的打印尺寸而不是px。但是，最终结果可能仍取决于浏览器的使用情况。如果将HTML转换为PDF（或从头开始生成PDF）是一种选择，打印PDF将在屏幕和纸张上为您提供最真实的WYSIWYG。
If you're trying to achieve precision in printing an HTML layout, as others have suggested, your CSS should use print dimensions like em, pt or pc instead of px. However, the final outcome might still depend on the browser using. If converting your HTML to PDF (or generating PDF from scratch) is an option for you, printing a PDF would give you the truest WYSIWYG both on screen and paper.
- 有关dpi的误解
- < a href =http://www.unleash.com/knpepper/dpi/ =noreferrer> DPI，PPI，像素 - 事实和谬误
- Misunderstandings about dpi
- DPI, PPI, Pixels - Facts and Fallacies
这篇关于如何通过javascript访问屏幕显示的DPI设置？的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！
