1,物理尺寸和分辨率

  容器的尺寸是指当前分辨率下的高度、宽度,而不是物理高度、宽度。

  如:一个22寸的显示器,屏幕分辨率为1366 * 768,那么获取到的屏幕高度为1366px,宽度为768px。

2,总体展示图

  

3,屏幕的高度

  

  screen.height :屏幕高度。

  screen.width :屏幕宽度。

  screen.availHeight :屏幕可用高度。即屏幕高度减去上下任务栏后的高度,可表示为软件最大化时的高度。

  screen.availWidth :屏幕可用宽度。即屏幕宽度减去左右任务栏后的宽度,可表示为软件最大化时的宽度。

  任务栏高/宽度 :可通过屏幕高/宽度 减去 屏幕可用高/宽度得出。如:任务栏高度 = screen.height - screen.availHeight 。

4,浏览器

  

  window.outerHeight :浏览器高度。

  window.outerWidth :浏览器宽度。

  window.innerHeight :浏览器内页面可用高度;此高度包含了水平滚动条的高度(若存在)。可表示为浏览器当前高度去除浏览器边框、工具条后的高度。

  window.innerWidth :浏览器内页面可用宽度;此宽度包含了垂直滚动条的宽度(若存在)。可表示为浏览器当前宽度去除浏览器边框后的宽度。

  工具栏高/宽度 :包含了地址栏、书签栏、浏览器边框等范围。如:高度,可通过浏览器高度 - 页面可用高度得出,即:window.outerHeight - window.innerHeight。

5,页面

  

  

  body.offsetHeight :body总高度。

  body.offsetWidth :body总宽度。

  body.clientHeight :body展示的高度;表示body在浏览器内显示的区域高度。

  body.clientWidth :body展示的宽度;表示body在浏览器内显示的区域宽度。

  滚动条高度/宽度 :如高度,可通过浏览器内页面可用高度 - body展示高度得出,即window.innerHeight - body.clientHeight。

具体详情:http://www.cnblogs.com/polk6/archive/2016/01/03/5051935.html

HTML 获取屏幕,浏览器,页面的高度的更多相关文章

  1. JS获取屏幕,浏览器窗口大小,网页高度宽度(实现代码)_javascript技巧_

    JS获取屏幕,浏览器窗口大小,网页高度宽度(实现代码)_javascript技巧_--HTML5中文学习网 http://www.html5cn.com.cn/shili/javascripts/79 ...

  2. JavaScript获取屏幕和页面的宽度和高度

    JavaScript获取屏幕和页面的宽度和高度 1.设计源码 <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN ...

  3. Js动态获取iframe子页面的高度////////////////////////zzzz

    Js动态获取iframe子页面的高度   Js动态获取iframe子页面的高度总结 问题的缘由 产品有个评论列表引用的是个iframe,高度不固定于是引发这个总结. 方法1:父级页面获取子级页面的高度 ...

  4. Js动态获取iframe子页面的高度总结

    问题的缘由 产品有个评论列表引用的是个iframe,高度不固定于是引发这个总结. 方法1:父级页面获取子级页面的高度 给元素设置高度 这方法是用在父级页面里的,通过获取子级页面的高度给iframe设置 ...

  5. android之获取屏幕的宽度和高度

    获取屏幕的宽度和高度: 方法一: //获取屏幕的宽度 public static int getScreenWidth(Context context) { WindowManager manager ...

  6. Uipath 获取当前浏览器页面URL

    文章来源东京IT青年前线 http://www.rpatokyo.com   Uipath 获取当前浏览器页面URL的方法 Inject Js Script   因为目前没有直接获取页面URL的Act ...

  7. 获取iframe子页面内容高度给iframe动态设置高度

    <!DOCTYPE html><html> <head> <meta charset="UTF-8" /> <meta nam ...

  8. Java 获取屏幕的宽度和高度

    获取屏幕的宽度和高度 1 import java.awt.Dimension; 2 import java.awt.Toolkit; 3 4 public class Main { 5 6 publi ...

  9. js获取不同浏览器盒子宽度高度

    DTD 已声明 IE document.documentElement.scrollHeight 浏览器所有内容高 度 ,document.body.scrollHeight 浏览器所有内容高度 do ...

  10. android 获取屏幕的高度和宽度、获取控件在屏幕中的位置、获取屏幕中控件的高度和宽度

    (一)获取屏幕的高度和宽度 有两种方法: 方法1: WindowManager wm = (WindowManager) getContext().getSystemService(Context.W ...

随机推荐

  1. 已知有字符串foo=”get-element-by-id”,写一个function将其转化成驼峰表示法”getElementById”

    题目:已知有字符串foo=”get-element-by-id”,写一个function将其转化成驼峰表示法”getElementById”. 代码: <!DOCTYPE html> &l ...

  2. Android文章收藏

     Android集 1.Himi李华明的<Android游戏开发专栏>http://blog.csdn.net/column/details/androidgame.html2.老罗的&l ...

  3. struts2中怎样处理404?

    眼下在做一个网络应用程序,struts2 + spring + hibernate,server是tomcat.希望用户在IE地址栏乱敲的时候.所敲入的全部没有定义的URL都能被程序捕捉到,然后转到一 ...

  4. 使用React的static方法实现同构以及同构的常见问题

    代码地址请在github查看,假设有新内容.我会定时更新.也欢迎您star,issue,共同进步 1.我们服务端渲染数据从何而来 1.1 怎样写出同构的组件 服务端生成HTML结构有时候并不完好.有时 ...

  5. cache和内存

    CPU与内存 北桥:主桥,主要用来处理高速信号,负责与处理器的联系:CPU通过FSB前端总线来访问内存控制器. 南桥:IO桥,负责IO总线之间的通信,比如PCI总线.SATA.USB等,可以连接光驱. ...

  6. [译]GLUT教程 - 重整子窗体

    Lighthouse3d.com >> GLUT Tutorial >> Subwindows >> Reshape Subwindows 重整函数的回调需要处理两 ...

  7. window mysql安装步骤

    window安装mysql(本人系统win10 64位 安装mysql-5.7.10-winx64) 1. 官网下载mysql zip安装包,然后解压到你想安装的目录,假设解压的目录是P:\mysql ...

  8. python之开篇---hello world!

    (1)前沿 (2)python 简介 (3)python hello world 实现 (4) -------------qq:1327706646 ------------------------- ...

  9. 请求SQL数据是存在<null>,的解决方法

    删除字典中的null 我们在处理服务器传过来的数据过程中,如果数据中出现null,我们是没法进行本地持久化处理的.在使用NSUserDaults保存本地时,如果其中一个字段的value为NULL值,就 ...

  10. poj1845(二分快速求等比数列模M和)

    Sumdiv Time Limit: 1000MS   Memory Limit: 30000K Total Submissions: 17039   Accepted: 4280 Descripti ...