What are css absolute units?

In CSS, the full name of absolute unit is "absolute length unit", which is a fixed value that reflects a real physical size; the absolute unit depends on the output medium and does not depend on the environment (monitor, resolution) , operating system, etc.). CSS absolute units include cm (centimeters), mm (millimeters), in (inches), px (pixels), pt (points), and pc (picas).

The operating environment of this tutorial: Windows 7 system, CSS3&&HTML5 version, Dell G3 computer.

CSS length units can be divided into: relative length units and absolute length units.

Relative units

Relative length units specify the properties of one length relative to another length. It is more suitable for different equipment and relative lengths.

Unit	Description
em	It is The description is relative to the font size applied to the current element, so it is a relative length unit. The default font size of general browsers is 16px, then 2em == 32px
ex	depends on the height of the English letter x
ch	The width of the number 0
rem	rem is the abbreviation of root (root em), relative to the root element font size ( Relative to the HTML root element);
vw	viewpoint width, window width, 1vw = 1% of the window width
vh	viewpoint height, window height, 1vh = 1% of the window height
vmin	The smaller of vw and vh
vmax	The larger of vw and vh

Absolute unit

The absolute length unit is a fixed value that reflects a real physical size. Absolute length units depend on the output medium and are not dependent on the environment (monitor, resolution, operating system, etc.)

Units	Description
cm	cm
mm	MM
in	Inches (1in= 96px = 2.54cm)
px	Pixels
pt	point (1pt = 1/72in)
pc	pica about 12pt (1pc = 12pt)

css px unit---the most commonly used length unit

px is also known as: pixel, which is the screen media (that is, on the computer (read on screen) is a fixed-size unit that is measured in degrees. One pixel is equal to one point on the computer screen (ie: the smallest division of the screen resolution), and web pages can be perfectly rendered precisely per pixel. Let’s take a look at how to set it up, for example:

.demo{  font-size: 40px; }

css pc unit

pc: pica( Pica), which is equivalent to the size of my country's new No. 4 type.

.demo{  font-size: 4pc; }

css pt unit

pt: Point, absolute length unit

.demo{  font-size: 40pt; }

css inunit

in: Inch, a physical unit of measurement, but in the CSS world , inches are simply mapped directly to pixels.

.demo{  font-size: 0.5in; }

css mm unit

mm: Millimeter (Millimeter), which is a small order of magnitude physical unit of measurement.

.demo{  font-size: 10mm; }

css cm unit

cm: Centimeter, for most people in the world For people, it is a relatively familiar and useful unit of physical measurement. In css it is also mapped to pixels.

.demo{  font-size: 1cm; }

Expand knowledge:

Let’s take a look at how these units of length are converted:

1in = 2.54cm = 25.4 mm = 72pt = 6pc=96px

Below we give the formula for the mutual conversion of pt and px:

px = pt *（96/72）
pt=px*（72/96）

(Learning video sharing: Getting started with web front-end)

The above is the detailed content of What are css absolute units?. For more information, please follow other related articles on the PHP Chinese website!