What are the main units of CSS absolute length? How to convert between absolute length units?

This article will introduce to you what are the main absolute length units in CSS length units and how to convert them. It has certain reference value. Friends in need can refer to it. I hope it will be helpful to you.

There are many length units in CSS, which can be described as diverse, but they can basically be divided into three categories: relative length units, absolute length units and visual area percentage length units. The absolute length units represent: length units that are fixed to each other and will not change due to changes in the size of other elements, mainly including: px, pc, pt, in, mm, cm.

First of all, let’s briefly introduce these units of length.

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

px is also known as: pixel, which is the screen media (that is, read on the computer screen Take) a unit of fixed size, which is a unit measured in angle. 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; }

Then, let’s take a look at how these length units 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 )

Summary: The above is the entire content of this article, I hope it will be helpful to everyone's study. For more related tutorials, please visitCSS Basics Video Tutorial,CSS3 Video Tutorial,bootstrap Video Tutorial!

The above is the detailed content of What are the main units of CSS absolute length? How to convert between absolute length units?. For more information, please follow other related articles on the PHP Chinese website!