移动web设计稿尺寸,关于移动web尺寸的那点事
2015-10-20 10:40
302 查看
我自己的做稿子的时候,一开始就有一个习惯,先放上这段代码
<meta name="viewport" content="width=device-width, initial-scale=1.0, maximum-scale=1.0, user-scalable=no" /> 未隐藏URL栏
<meta name="viewport" content="width=device-width, initial-scale=1.0, maximum-scale=1.0, user-scalable=no, minimal-ui" /> 已隐藏URL栏
1:1显示(initial-scale=1.0, maximum-scale=1.0),
禁止放大缩小(user-scalable=no)
隐藏IOS系统浏览器的URL栏目与状态栏目(minimal-ui,只有IOS7版本支持哦)
现在就是1:1显示啦,
移动wep肯定是用HTML5啦!!不用说的
然后就
alert('width:' + window.innerWidth + ';height:' + window.innerHeight);
这样就能可视区域1:1的尺寸啦!!
这样就得到机子可视区域尺寸啦!!然后直接就可以在PS或AI里面做稿喽,
记得是72分辨率哦,
还有一点特别注意,就是图片的问题,一定要加1倍的宽和高才能让图片特别清晰哦,优其是LOGO,这个~~你懂的~~~~~
目前我知道的移动端可视区尺寸
iPhone4/iPhone4s 320 * 372 / 320 * 441 (已隐藏URL与状态栏)
iPhone5/iPhone5s 320 * 460 / 320 * 529 (已隐藏URL与状态栏)
Note2 360 * 567 (未隐藏URL与状态栏)
iPad 3/4 768*928 (未隐藏URL与状态栏)
GALAXY SIII 360 * 567 (未隐藏URL与状态栏)
小米2A 360 *567 (未隐藏URL与状态栏)
HTC G10 320 * 460
以上是我目前知道的,还有特别多,大家有空多打印出来,再分享出来啦,人多力量大,用的机子也不同
听说
window.onload = function(){
setTimeout(scrollTo,0,0,0);
}
可以隐藏android和IOS系统的URL,但我一直试都不行,是我弄错了,还是机子问题,还是TM的不给力。
<meta name="viewport" content="width=device-width, initial-scale=1.0, maximum-scale=1.0, user-scalable=no" /> 未隐藏URL栏
<meta name="viewport" content="width=device-width, initial-scale=1.0, maximum-scale=1.0, user-scalable=no, minimal-ui" /> 已隐藏URL栏
1:1显示(initial-scale=1.0, maximum-scale=1.0),
禁止放大缩小(user-scalable=no)
隐藏IOS系统浏览器的URL栏目与状态栏目(minimal-ui,只有IOS7版本支持哦)
现在就是1:1显示啦,
移动wep肯定是用HTML5啦!!不用说的
然后就
alert('width:' + window.innerWidth + ';height:' + window.innerHeight);
这样就能可视区域1:1的尺寸啦!!
这样就得到机子可视区域尺寸啦!!然后直接就可以在PS或AI里面做稿喽,
记得是72分辨率哦,
还有一点特别注意,就是图片的问题,一定要加1倍的宽和高才能让图片特别清晰哦,优其是LOGO,这个~~你懂的~~~~~
目前我知道的移动端可视区尺寸
iPhone4/iPhone4s 320 * 372 / 320 * 441 (已隐藏URL与状态栏)
iPhone5/iPhone5s 320 * 460 / 320 * 529 (已隐藏URL与状态栏)
Note2 360 * 567 (未隐藏URL与状态栏)
iPad 3/4 768*928 (未隐藏URL与状态栏)
GALAXY SIII 360 * 567 (未隐藏URL与状态栏)
小米2A 360 *567 (未隐藏URL与状态栏)
HTC G10 320 * 460
以上是我目前知道的,还有特别多,大家有空多打印出来,再分享出来啦,人多力量大,用的机子也不同
听说
window.onload = function(){
setTimeout(scrollTo,0,0,0);
}
可以隐藏android和IOS系统的URL,但我一直试都不行,是我弄错了,还是机子问题,还是TM的不给力。
相关文章推荐
- HDU 5505 GT and numbers(gcd)
- win10怎么设置有鼠标时关闭触摸板?
- POJ2488 dfs回溯
- C#: 向Word插入排版精良的Text Box
- form+iframe实现无刷新上传文件
- There is no statement named OproductKey.selectProductkey in this SqlMap
- 异常情况下Activity生命周期分析
- AndroidUI-TxetView嵌套Html的使用
- CentOS-minimal 6.5 安装mysql
- spring aop的案例(二)缓存配置
- 图像处理之添加高斯与泊松噪声
- gprof的使用介绍
- Lua在Linux下的安装
- Gallery简单应用
- A20串口的调试,特殊波特率
- eclipse一些问题点归纳整理
- hook对应的汇编码0x8B, 0xFF,0x55,0x8B, 0xEC, // mov ebp,esp
- 配置git for eclipse
- 电磁感应加热的多路技术
- 图像处理之应用篇-大米计数续