首页 > 代码库 > 关于移动端实战的一些总结

关于移动端实战的一些总结

移动板与pc板的布局有什么不同呢? 我的理解是移动端的布局相对较窄,字体图片等应当较大(为了在手机上的小屏显示清楚),且应当适应一定范围内不同类型的手机。

如何做到自适应的手机布局呢 这次实战我使用了一条新语句:

<meta content="width=750,  maximum-scale=1.0, user-scalable=no" name="viewport">

这条语句能让手机适应750px的宽度且不允许放大缩小。

还有上次提出过的媒体查询(终端发生变化时做出相应的样式改变)也能做出自适应的效果。

手机端和pc端不同的还有这里的hover算active的效果。

另外图片精灵(雪碧图)也是有优点与缺点。

优点有节省带宽,配合某些插件能更方便使用。

缺点是背景不能微调(调了容易显示到其他图片) 不能重复 不能使用img显示 等

rem和em也是自适应的利器。

他们可以改变一个数值令其他数值改变。

接下来就是令上一个项目适应pc pd 手机端,希望这次能够更加提升自己的实力。

关于移动端实战的一些总结