传智黑马39期WEB前端教程-第12阶段移动web开发基本功-第1节移动web基础知识-第4部分css像素

第12阶 段移动web开发基本功

第1节 移动web基础知识

第4部分 css像素

1、物理像素指的是屏幕渲染图像的最小单位，属于屏幕的物理属性，不可人为进行改变，其值大小决定了屏幕渲染图像的品质，我们以上所讨论的都指的是物理像素。

// 获取屏幕的物理像素尺寸
window.screen.width;
window.screen.height;

部分移动设备下获取会有错误，与移动开发无关，只需要了解

见代码示例1-2.html

2、CSS像素，与设备无关像素，指的是通过CSS进行网页布局时用到的单位，其默认值(PC端)是和物理像素保持一致的（1个单位的CSS像素等于1个单位的物理像素），但是我们可通缩放来改变其大小。

见代码示例1-3.html

我们通过调整浏览器的缩放比例可以直观的理解CSS像素与物理像素之前的对应关系，如下图所示：

我们需要理解的是物理像素和CSS像素的一个关系，1个物理像素并不总是等于一个CSS像素，通过调整浏览器缩放比例，可以有以上3种情况。