码迷,mamicode.com
首页 > 移动开发 > 详细

移动端适配深入

时间:2020-01-04 18:16:35      阅读:89      评论:0      收藏:0      [点我收藏+]

标签:显示   屏幕   完美   窗口   复杂   最小   适配   系统   移动   

前言:移动端适配需要先了解很多概念

比如四个像素

物理像素

 (就是手机屏幕分辨率,设备成像的最小单元。多少乘以多少,就是有多少个物理像素)

设备独立像素

  这个就是另外一个概念(手机页面能操作的最小单元)

  重点:由相关系统可以转化为物理像素,同样也是设备提供的一个接口(对接css像素)

css像素

  也是一个虚拟概念(pc端能操作的最小单元)

位图像素

  图片的最小单元(位图像素必须1:1 才能完美显示)


 

另外一个重点就是视口

三个视口

前言:在pc端,视口就是浏览器的可视区域,其宽度与浏览器宽度保持一致

移动端中就比较复杂

因为:移动端的浏览器宽度通常240px-640px。而大多数为pc端设计的网站宽度至少

800px。如果仍然以浏览器窗口作为视口的话,网站的内容在手机上看起来会非常窄

字非常小。因此引进了三个视口。使得移动端中的视口与浏览器宽度不再关联

移动端适配深入

标签:显示   屏幕   完美   窗口   复杂   最小   适配   系统   移动   

原文地址:https://www.cnblogs.com/-constructor/p/12149796.html

(0)
(0)
   
举报
评论 一句话评论(0
登录后才能评论!
© 2014 mamicode.com 版权所有  联系我们:gaon5@hotmail.com
迷上了代码!