Menu
I would like to know how the -webkit-device-pixel-ratio is calculated. I had already read this. Yet I am unable to understand it clearly. I would also like to know if there is a list of which devices use which pixel ratio. The android website says
The Android Browser and WebView support a CSS media feature that allows you to create styles for specific screen densities—the -webkit-device-pixel-ratio CSS media feature. The value you apply to this feature should be either "0.75", "1", or "1.5", to indicate that the styles are for devices with low density, medium density, or high density screens, respectively.
but I found that we need to use -webkit-device-pixel-ratio=2 to make a web application compatible on 768 x 1280 resolution screen.
418
Dividing the physical ppi by the ideal ppi of 150, gives the device pixel ratio.
The devicePixelRatio of Window interface returns the ratio of the resolution in physical pixels to the resolution in CSS pixels for the current display device. This value could also be interpreted as the ratio of pixel sizes: the size of one CSS pixel to the size of one physical pixel.
The width and height of the image in pixels. To find the total number of pixels, multiply the width and height together. In this case, 4700 pixels x 3133 pixels = 14,725,100 pixels. That's a lot of pixels.
DPR or Device Pixel Ratio, also known as CSS pixel ratio, is the number of physical pixels that make up a CSS pixel in one direction of a screen like in the width direction or in the height direction. In other words, it is the ratio between the physical pixels and the CSS pixels.
According to this article
http://www.html5rocks.com/en/mobile/high-dpi/
The magic number seems to be 150.
Dividing the physical ppi by the ideal ppi of 150, gives the device pixel ratio.
E.g. a device with 445ppi would have a dpr of 3 ->> 445 / 150
The simple calculation seems to hold up okay for many items on this list,
http://en.wikipedia.org/wiki/List_of_displays_by_pixel_density
127
If you love us? You can donate to us via Paypal or buy me a coffee so we can maintain and grow! Thank you!
Donate Us With
