css不同分辨率下1px

CSS中的像素（px）是指对于显示器来说，一个像素点的尺寸。在不同的分辨率下，一个像素点的尺寸是不同的，因此在不同的分辨率下，CSS中的1px所表示的尺寸也是不同的。

/* 在设备像素比为1（即普通屏幕）下，1px等于1个物理像素 */
div{
   width: 100px;
   height: 100px;
   border: 1px solid black;
} 

在设备像素比为1下，1px等于1个物理像素，因此上述代码中的边框宽度为1个物理像素。

/* 在设备像素比为2下，1px等于2个物理像素 */
div{
   width: 100px;
   height: 100px;
   border: 1px solid black;
   transform: scale(0.5);
} 

在设备像素比为2下，1px等于2个物理像素，因此上述代码中的边框宽度为2个物理像素。为了让页面在高分辨率的设备上显示得更为清晰，可以通过transform属性来缩小元素，从而使页面中的元素在高分辨率设备上显示得更为清晰。

/* 在设备像素比为3下，1px等于3个物理像素 */
div{
   width: 100px;
   height: 100px;
   border: 1px solid black;
   transform: scale(0.33);
} 

在设备像素比为3下，1px等于3个物理像素，因此上述代码中的边框宽度为3个物理像素。同样，为了让页面在超高分辨率的设备上显示得更为清晰，可以通过transform属性来缩小元素，从而使得页面中的元素在超高分辨率设备上显示得更为清晰。