我想做个手机html页面,这个手机有720p的,1080p的,2160p的,这些宽度都怎么解决的呢?

Question

第一次做手机页面,手机html的源文件也不知道怎么去看,
问问大家手机的源文件都怎么看的呢,还有就是 这个720p 1080p的手机看到的html页面是一个页面,
还是不同页面,要是不同页面,他是怎么判断的呢?

Answer 1

手机端的页面不在于手机屏幕分辨率，而是在手机屏

幕的尺寸，你上面描述的720配合1080p都是指手机的分辨率吧，你也可以叫他物理分辨率！

想知道物理分辨率的话, window.screen.width * window.devicePixelRatio，然后就可以判断在不同分辨率下显示不同的页面。

屏幕适配嘛，就是用rem作为单位，使用弹性盒模型！

你这里应该就是想做有个手机的HTML页面的话，就和720P,1080P，没什么关系，你要考虑的是手机的屏幕宽度，就是在不同屏幕大小的手机上正常显示，而不是物理分辨率。

现在常用的解决手机端屏幕适配的方法就是rem作为单位，rem的用法社区有很多的讲解，我这一时也说不清楚。
rem建议js动态设置，不要写死！

手机端页面自适应解决方案—rem布局进阶版

弹性盒模型链接

Answer 2

这个问题有点泛了……
一般来说最简单的当然就是一个页面来做，可以用手淘的方案，详情见：https://github.com/amfe/lib-f...

不排除会根据不同手机用不一样的页面，但有点麻烦了，如果要做不同页面，可以考虑js判断屏幕宽度来做页面跳转，又或者针对不同的手机判断不同的useragent来做页面跳转。

Answer 3

目前基本会用 rem 来解决的， 手淘也是， 介绍一下我们是怎么用的，可以参考一下：自适应手机h5页面，rem助你适配终端

Answer 4

如果只是html的应用，推荐Dcloud，全适应ios、安卓等多端发布。