#每天一个知识点#
viewport

viewport 是浏览器的可视区域，可视区域的大小是浏览器自己设置的。它可能大于移动设备可视区域，也可能小于移动设备可视区域。一般来讲，移动设备上的viewport都是大于移动设备可视区域。在控制台输出window.innerWidth查看Viewport大小。

相关概念
设备像素：设备屏幕分辨率。iphone6p 的分辨率是 1334*750；
设备独立像素：设备上程序用来描绘数据的一个个的“点”, 在控制台用 screen.width/height查看。iphone6p 的设备独立像素是375*667；
设备像素比（DPR）：设备像素(宽)/设备独立像素(宽)，DPR越高渲染越精致。在控制台输出window.devicePixelRatio查看设备像素比。iphone6s 的设备像素比就是 750 / 375 = 2；
CSS像素：浏览器使用的单位，用来精确度量网页上的内容。在一般情况下(页面缩放比为 1)，1 个 CSS 像素等于 1 个设备独立像素。
屏幕尺寸：屏幕对角线的长度，以英尺为单位。
像素密度（PPI）：每英寸屏幕拥有的像素数。
展开
前端开发圈
评论
相关推荐