CSS pixels (px)
Px stands for CSS pixels. You've probably heard the term and are thinking about device pixels — the smallest light blobs that make up any display picture. Those are not the pixels used in CSS — otherwise, everything would look progressively smaller with higher screen resolution.
CSS pixels are also called reference pixels. The W3C CSS specification defines a CSS pixel as the visual angle of one pixel on a device with a pixel density of 96 PPI (pixels per square inch) and a distance from the reader of an arm's length.[1] It means that the CSS pixel dimension depends on the distance between the viewer and the display. At the same time, an element whose size is set in CSS pixels will look the same on different quality screens.
Pixels are a canonical measurement on the web because browsers handle them consistently, and other absolute length units map directly to pixels — for example, 1px=1/96in.