Development Foundation of H5 pixel resolution, DPI, PPI
html5
2016-09-03 to prairie
background knowledge:
At present, most displays are based on the lattice, arranged in a large rectangular through a series of small dots to form the image displayed by a different color for each dot, we have referred to a pixel in each dot (pixel) .
The concept points:
1. Dot: a point of physical properties, printer or screen print by these point out the picture. Dot point of a screen is fixed. After a specific line up to the display, a plurality of points (DOTS), an overall width and height configuration, we call display "physical size (physical size)", the unit is "width x height", e.g. 12 "x7.5".
2. Pixel: a block of pixels, a colored, a Pixel Dot may be provided by a number of physical components. In specific settings, monitor the number of columns of pixels is called the display row number "resolution (Geometry)" representation is "the number of pixels the number of pixel width x height", e.g. 1440x900. Under the same resolution, each dot (dots) of large size may still be small. Also 900 points, if each point 1 mm, that is 90 cm, 1 cm if each point, that is 9 meters.
3. DPI: dots per inch, called a resolution, the number of one inch Dots can be included in this pixel the pixel refers to the physical, real.
4. PPI: pixels per inch, the number of pixel per inch. PPI = the number of pixels (√ (x² + y²)) / physical size (number of inches), x is the number of pixels in the x-axis, y is the number of pixels in the y-axis, to calculate the diagonal use, because the screen is of diagonal length (screen size, physical size) is good to set the precise value at manufacturing companies.
5. DP: Device independent Abbreviation Pixel (device independent pixels), also called DiP, 1dp represents the screen when the pixel density is 160ppi 1px length, is the concept of andriod.
6. PT: point, is a unit of length, common standards is 1 pt = 1/72 inch (1 inch = 2.54 cm), also known as the standard PostScript point, Point and centimeters, millimeters, what unit is no essential difference, but the length different, pt, and the screen does not matter, only the resolution and related documents, Apple concept.
7. DP and PT is used to define application standard units at different equipment, the DPI.
8. Px: css pixels logical pixel, the browser uses the abstract units
9. DPR: device pixel ratio, the zoom ratio of the pixel device, on a plane: 1px = (dpr) ^ 2 * dp, latitude: 1px = dpr * 2
Example: iphone5: Resolution 640px * 1136px, PPI: 326PPI, dpr dpr graph of available iphone5 2, according to the Lat: 1px = dpr * px, iphone5 screen is 320px * 568px.
10. The screen resolution
Resolution is the number of pixels on the screen, for example, 2560 × 1440px screen, the screen has transversely 2560 pixels, there are 1440 pixels vertical. 27 "monitor has a resolution of 2560 × 1440px point to point, 109PPI. If the screen resolution is lower, will find a window screen, icon, is substantial, because 27" on fewer pixels. In fact, so many pixels, or pixels, PPI or the PPI, fewer pixels is because when you lower the screen resolution, operating system will come to fill the screen by stretching, this time CPU / GPU will be calculated using a point to point pixels sets new resolution.
screen:
HD: 1280 * 720px resolution
full HD: 1920 * 1080px resolution
4K: QHD or UHD (Ultra High Definition), is the minimum resolution of 3840 × 2160px, another common resolution is 4096 × 2160px
Retina screen: Retina is a specification, by decreasing the spacing between the pixels and a pixel size, a substantial increase in the value of the screen ppi. Retina screen dpr than or equal to 2.