注:本文是学习笔记,并不是教程,所以会有很多我不理解或猜测的问题,也会有不尽详实之处,望见谅。 对于pc端网页设计师来说,移动端的网页制作,我之前只是简单的加了一个 <meta name="viewport" content="widt ...
注:本文是学习笔记,并不是教程,所以会有很多我不理解或猜测的问题,也会有不尽详实之处,望见谅。
对于pc端网页设计师来说,移动端的网页制作,我之前只是简单的加了一个
<meta name="viewport" content="width=device-width initial-scale=1.0 maximum-scale=1.0 user-scalable=none">
然后再根据实际预览效果,对一些比例或者清晰度问题进行调整,以达到最佳效果。当然,这可以说只是为了应付工作。
最近工作告一段落,就有想法系统学习一下移动端网页。因为已经有一定基础,所以最快的学习方法,无异于肢解一个现成的移动端网站。
而淘宝网触屏版应该会是个不错的选择!
本学习笔记都是xh本人根据网络资料和自身理解写成,如有不对之处,请在评论处指出,我会及时修改,多谢。
以上(都是废话)。
所谓肢解,必须是一行行解剖学习下去!
所以,我在第二行便遇到了一个知识点:dpr。
dpr:设备像素比(devicePixelRatio)。
其定义:
window.devicePixelRatio是设备上物理像素和设备独立像素(device-independent pixels (dips))的比例。
公式表示就是:window.devicePixelRatio = 物理像素 / dips
具体详细介绍资料:
鑫空间的博文(2012年):http://www.zhangxinxu.com/wordpress/2012/08/window-devicepixelratio/
JS调用方法:
<script> var dpr=window.devicePixelRatio; alert(dpr);</script>
原标题:淘宝网触屏版
关键词:
*特别声明:以上内容来自于网络收集,著作权属原作者所有,如有侵权,请联系我们:
admin#shaoqun.com
(#换成@)。