这是一个创建于 3819 天前的主题，其中的信息可能已经有所发展或是发生改变。
情况是这样的。之前没怎么接触过移动端页面的制作==！
然后这回我按照psd的图切了，几个背景，都放到一个大图里，用的时候就定位用，接着我将整体的 宽度设置为640px，meta中禁止缩放，但是在实际结果中，发现页面瘫了，貌似呈现的效果就是感觉就是感觉宽度设定不对，有部分溢出了，如果在meta中设置了width为640px。就又能用了！！
问题是这是个什么情况。是不是不能将整体设置为640px的？
不晓得我的表诉是不是太渣了==！
然后这回我按照psd的图切了，几个背景，都放到一个大图里，用的时候就定位用，接着我将整体的 宽度设置为640px，meta中禁止缩放，但是在实际结果中，发现页面瘫了，貌似呈现的效果就是感觉就是感觉宽度设定不对，有部分溢出了，如果在meta中设置了width为640px。就又能用了！！
问题是这是个什么情况。是不是不能将整体设置为640px的？
不晓得我的表诉是不是太渣了==！
 |
1
Tankpt OP ==大神周末不在吗
|
 |
2
jsonline 2014-07-05 12:37:28 +08:00 via Android
代码放到 jsbin 再来讨论。
|
 |
3
coraline 2014-07-05 12:49:32 +08:00
iphone 的 viewport 是320px android的viewport 各不相同， 所以你是不能直接定义px
|
|
6
coraline 2014-07-05 12:57:15 +08:00
@Tankpt 移动端的话最好是百分比来布局，背景不一定要用background-size来设置，background-size用来2x图片避免模糊。
|
|
7
Tankpt OP @coraline 那那些图应该怎么处理呢？设计给的都是640px的宽度。我看到backgound-size：contain貌似就能让背景包含进去。自适应
|
 |
8
vexfisher 2014-07-05 13:05:40 +08:00
我也经常要做移动端页面，于是做了iMobile组件，希望可用帮到你。
https://github.com/ikitty/iMobile 原理是通过动态调整viewport的值来自动适应各种分辨率的手持设备。对于apple机器直接设置viewport中的width，对于android机器，则是设置dpi。 |
|
9
coraline 2014-07-05 13:08:46 +08:00
@Tankpt 图片是web ui图还是展示图片？ 如果是展示图片的话，可以设定 max-width: 90%;
max-height: 90%; 反正就是不超过100% ， 这样就不会超出页面 |
|
12
vexfisher 2014-07-05 13:14:22 +08:00
@Tankpt 如果方便的话，可用把代码托管到github上，这样大家可用帮你看看
另外按你的描述，在viewport中写死width，那你的网页在大屏幕的android手机是无法填充整个屏幕（右侧会有白条） |
 |
13
zhoufenfens 2014-07-05 14:09:48 +08:00
设计给的当然是640x960像素的设计稿，你放在手机页面上涉及到retina屏的问题，所以你需要把基准设置到320px,然后用background-size：100% 100%去控制
|
|
14
Tankpt OP @zhoufenfens 问下这个基准是怎么处理呢==第一次做，好尴尬
|
Select Language