关于移动端设备的问题？

老师现在实际开发中，知道一款设备的屏幕尺寸和分辨率，我如何算出该设备实际显示的width与height呢？因为只想在这个特定的设备上显示，所以有这个需求。

von_colonel 2017-11-11

源自：移动基础 3-1 手机设备基本概念

收起

3回答

好帮手慕糖回答被采纳获得+3积分 2017-11-12 17:13:39

你好，不太了解你的具体需求，建议：可查看一下方法是否符合你的需求，若不是这个意思，建议：详细的把问题描述下。

网页可见区域宽：document.body.clientWidth
网页可见区域高：document.body.clientHeight
网页可见区域宽：document.body.offsetWidth (包括边线的宽)
网页可见区域高：document.body.offsetHeight (包括边线的宽)
网页正文全文宽：document.body.scrollWidth
网页正文全文高：document.body.scrollHeight
网页被卷去的高：document.body.scrollTop
网页被卷去的左：document.body.scrollLeft
网页正文部分上：window.screenTop
网页正文部分左：window.screenLeft
屏幕分辨率的高：window.screen.height
屏幕分辨率的宽：window.screen.width
屏幕可用工作区高度：window.screen.availHeight
屏幕可用工作区宽度：window.screen.availWidth

祝学习愉快~

收起回答

von_colonel 提问者 #1

非常感谢！

2017-11-12 18:30:49
von_colonel 提问者 #2

主要就是我想针对某一设备做适配，但是目前我只知道该设备的分辨率和屏幕尺寸。我该如何确定我在实际开发过程中我的整个html,body的高宽呢？例如我只针对iphone5做适配，那么我的宽就定死为320px。那其他设备我怎么确定呢？

2017-11-12 18:37:14

怎么都被占用了呢 2017-11-13 11:29:44

使用响应式呀，后面的响应式步骤，会教你如何写一个适配多个设备的页面。

收起回答

小于飞飞 2017-11-12 17:24:50

移动上开发，考虑物理像素和独立设备像素，所以上开发在实际开发中，设置<meta name="viewport" content="width=device-width, initial-scale=1.0, maximum-scale=1.0,minimum-scale=1.0,user-scalable=0" /> 该代码，使其两者保持一样，这样直接开发就可以。

收起回答