What is the difference between css pt and px?

There are two common types: px and pt. What are the differences between the two?

Px: pixel, pixel, minimum unit displayed on the screen;

Pt: point, which is a standard unit of length in the printing industry. 1pt = 1/72 inch;

In Windows, the text is defined as 96 dpi in the default display settings. This shows that 1px = 1/96 inch; while 1pt = 1/72 inch, we can conclude that in this setting, 1px = 0.75pt and the font size is 9pt = 12px.

However, you can modify the dpi size defined by the text, for example, to 144 dpi. In this way, 1px = 0.5pt and the font is 9pt = 18px. A text originally composed of 12 px, which is now composed of 18 px. If more px is used, the text is "big" and easier to read.

Therefore, the difference between px and pt is that px will change with the display resolution, and pt will change with the font size setting in Windows.