香港葡京赌侠诗(中国)有限公司

?
各地市:
郑州网站建设 洛阳网站建设 开封网站建设 安阳网站建设 新乡网站建设 濮阳网站建设 焦作网站建设 鹤壁网站建设 三门峡网站建设 商丘网站建设 许昌网站建设 漯河网站建设 平顶山网站建设 驻马店网站建设 周口网站建设 南阳网站建设 信阳网站建设 济源网站建设 二七区网站建设 中原区网站建设 管城区网站建设 惠济区网站建设 金水区网站建设 上街区网站建设 巩义市网站建设 新密市网站建设 登封市网站建设 荥阳市网站建设 中牟县网站建设 经开区网站建设 高新区网站建设 涧西区网站建设 西工区网站建设 老城区网站建设 瀍河回族区网站建设 洛龙区网站建设 吉利区网站建设 偃师市网站建设 孟津县网站建设 新安县网站建设 洛宁县网站建设 宜阳县网站建设 伊川县网站建设 嵩县网站建设 栾川县网站建设 汝阳县网站建设 杞县网站建设 兰考县网站建设 通许县网站建设 尉氏县网站建设 开封县网站建设 金明区网站建设 顺河回族区网站建设 龙亭区网站建设 鼓楼区网站建设 禹王台区网站建设 安阳县网站建设 林州市网站建设 内黄县网站建设 汤阴县网站建设 滑县网站建设 龙安区网站建设 殷都区网站建设 文峰区网站建设 北关区网站建设 辉县市网站建设 卫辉市网站建设 新乡县网站建设 获嘉县网站建设 原阳县网站建设 延津县网站建设 封丘县网站建设 长垣县网站建设 卫滨区网站建设 红旗区网站建设 牧野区网站建设 凤泉区网站建设 华龙区网站建设 清丰县网站建设 南乐县网站建设 濮阳县网站建设 莘县网站建设 范县网站建设 台前县网站建设
当前位置: 主页 > 维护运营 > 移动互联网 >

[干货分享] 移动前端分享:对于移动设备页面尺

发布时间:2017-03-18 15:01 | 发布者:香港葡京赌侠诗 | 浏览次数:次

   为移动设备制作前端页面,往往会遇到很多令人迷惑的情况,本文中,我整理了一些相关的概念和方法,与大家分享一下。


设备像素和CSS像素
css像素是固定不变的,浏览器上缩放的话,css像素会被拉伸或者缩小,设备像素不变


100%zoom : css像素 和设备像素 一致






pc上的viewport
viewport并非是移动端的专利,viewport是浏览器内部的一个数据,它约束html的宽度。viewport基本等同于窗口尺寸,所以当你缩放窗口的时候viewport会改变,相应的html宽度也会改变。






上面这张图片你可以这么理解:


手机是一个放大镜,它游走在页面上,手机上展示的宽高为visual-viewport,而整个页面的宽高是layout-viewport。


好奇的朋友一定会问,为什么要这样呢,何必这么麻烦?这是因为手机的尺寸太小了,“移动浏览器厂商想给它们的客户尽可能的提供最好的体验,这现在指的就是「尽可能的跟桌面一样」。因此耍一些花招是必要的。”


那么,假如我的页面没有经过任何优化,手机默认的layout-viewport是多大呢,“layout viewport有多宽?每个浏览器都不一样。Safari 苹果为980px,Opera为850px,Android WebKit为800px,最后IE为974px。”


这就是为什么普通一个页面在iphone上看会变得很大的原因,iphone默认把你的页面的viewport设置为980px,也就是说html的100%宽度默认为980px;

本文来自 郑州网站建设 香港葡京赌侠诗提供

?
?

香港葡京赌侠诗|香港葡京赌侠诗

XML 地图 | Sitemap 地图