
屏幕的总宽度和高度,他们是显示器的尺寸,而不是浏览器的尺寸。这些尺寸以设备像素为单位进行测量,平时很少用到
通过 screenwidth 和 screenheight 获取
浏览器窗口的内部尺寸,以CSS像素为单位(测量值包含滚动条)
通过 windowinnerWidth 和 windowinnerHeight 获取
文档的水平和垂直滚动偏移量。因此,您可以找出用户滚动了多少。以CSS像素为单位
通过 windowpageXOffset 和 windowpageYOffset 获取
字面理解,视口即可以看见的窗口大小。所以大多数情况下他和浏览器的窗口大小一致。
我们知道html页面最外层的元素是html,他在浏览器中显示,但其实在浏览器和html页面之间,还有一层,即:视口。
他在html元素的外层,包含html。
通过 documentdocumentElementclientWidth 和 documentdocumentElementclientHeight //documentdocumentElement实际上是html元素 获取
我们平时设置的html/body width:100%,实际上就是设置html,body等于视口的宽度。设置某个元素,如侧边栏width:20%,实际也是相对于视口设置的(如果他的上级元素是body:width:100%),所以当浏览器窗口变化,他的宽度会跟随变化。
但视口不是HTML创建的,因此不能受CSS影响。当我们设置html为固定宽度width:200px,它的值还是浏览器窗口的宽度和高度。
窗口包含滚动条的大小,视口不包含,视口只是我们可以看见的大小
即页面实际的宽和高
通过 documentdocumentElementoffsetWidth 和 documentdocumentElementoffsetHeight 获取
发生鼠标点击事件时,常见的属性值
@media all and (max-width: 400px)
此处的值一般指的浏览器大小,即视口的大小
A tale of two viewports — part one
A tale of two viewports — part two
以上就是关于网页常见的一些尺寸全部的内容,包括:网页常见的一些尺寸、、等相关内容解答,如果想了解更多相关内容,可以关注我们,你们的支持是我们更新的动力!
欢迎分享,转载请注明来源:内存溢出
微信扫一扫
支付宝扫一扫
评论列表(0条)