物理像素和CSS像素之间的转换 [英] Converting between physical pixels and CSS pixels
问题描述
来自 elementFromPoint 的Mozilla文档说明,坐标不是物理像素,但是CSS像素。什么是CSS像素?我的印象是CSS中的像素与物理像素相同。
Mozilla's documentation from elementFromPoint explains that the coordinates are not in physical pixels, but "CSS pixels". Exactly what are CSS pixels? I was under the impression that a pixel in CSS was the same as the physical pixel.
如果不是这样,如何在物理和CSS像素之间进行转换?
If this is not the case, how does one convert between physical and CSS pixels?
推荐答案
像素是一个物理屏幕像素,只要任何网页可以合理地关注自己。
A pixel is a physical screen pixel as far as any web page can reasonably concern itself.
CSS像素作为在CSS 2中定义
The wording ‘CSS pixel’ refers to a pixel as defined in CSS 2
最接近参考像素的设备像素的总数。建议参考像素是设备上一个像素的视角,像素密度为96dpi,距阅读器的手臂长度的距离。对于28英寸的标称手臂长度,视角因此为约0.0213度。
the whole number of device pixels that best approximates the reference pixel. It is recommended that the reference pixel be the visual angle of one pixel on a device with a pixel density of 96dpi and a distance from the reader of an arm's length. For a nominal arm's length of 28 inches, the visual angle is therefore about 0.0213 degrees.
这是说CSS像素是一个设备像素为正常,简单的屏幕情况。然而,对于操作系统将其正常尺寸增大2倍的专业超高分辨率屏幕,CSS像素可能是两个设备像素宽。
What this is saying is that a CSS pixel is a device pixel for the normal, simple screen cases. However, for specialist super-high-res screens where the OS scales up its normal dimensions by two, a CSS pixel may be two device pixels wide.
我们现在也有在大多数浏览器中的缩放功能,这将自然改变CSS像素(连同所有其他单位)的大小,因此它不匹配设备像素。
We now also have a ‘zoom’ feature in most browsers, which will naturally change the size of the CSS pixel (along with all other units) so it doesn't match a device pixel.
这篇关于物理像素和CSS像素之间的转换的文章就介绍到这了,希望我们推荐的答案对大家有所帮助,也希望大家多多支持IT屋!