总结各种width,height,top,left
1、offsetWidth
内容+内边距(padding)+边框(border)
2、offsetHeight
内容+内边距(padding)+边框(border)
3、offsetLeft
获取对象相对于有定位父对象(没有的话默认body)的左边距
4、offsetTop
获取对象相对于有定位父对象(没有的话默认body)的上边距
5、scrollTop
常用:document.body.scrollTop 浏览器卷去的高
6、clientHeight
常用:document.body.clientHeight 浏览器可视窗口的高
7、clientWidth
常用:document.body.clientWidth 浏览器可视窗口的宽
总结各种width,height,top,left的更多相关文章
- client/scroll/offset width/height/top/left ---记第一篇博客
client/scroll/offset width/height/top/left (盒模型为contentBox,定位原点是元素左上角边框最外层的交点) clientWidth width+左p ...
- offset[Parent/Width/Height/Top/Left] 、 client[Width/Height/Top/Left] 、 Element.getBoundingClientRect()
开篇提示:以下内容都经个人测试,参考API文档总结,但还是不能保证完全正确,若有错误,还请留言指出___________________________________________________ ...
- as3:sprite作为容器使用时,最好不要指定width,height
除 TextField 和 Video 对象以外,没有内容的显示对象(如一个空的 Sprite)的高度为 0,即使您尝试将 height 设置为其它值,也是这样. 如果您设置了 height 属性,则 ...
- 正则:img的url,width,height 和 a标签的url以及替换
代码:// 内容:$detail['content'] //img的url,width,height $img = array(); $matches = array(); $regeImg = '/ ...
- ffmpeg按比例缩放--"width / height not divisible by 2" 解决方法
最近在处理视频的时候,有这么一个需求 如果视频的分辨率宽度大于960的话,就把宽度设为960,而高度按其比例进行缩放 如果视频的分辨率高度大于540的话,就把高度设为540,而宽度按其比例进行缩放 之 ...
- 如何理解VB窗体中的scale类属性及width height属性之间的关系
如何理解VB窗体中的scale类属性及width height属性之间的关系 VB中的SCALEHIEGT,SCALEWIDTH,与窗体中的WIDTH,HEIGHT的区别及关系是许多VB初学者难以理解 ...
- css 行内元素 块元素 替换元素 非替换元素 以及这些元素的width height margin padding 特性
一.各种元素的width height margin padding 特性(具体css元素的分来参看二) 1.块级元素 width. height. margin的四个方向. padding的四个方向 ...
- js中width,height,left,top计算
①offset 包括了元素的边框和内边距和滚动条 offsetWidth.offsetHeight元素的宽度和高度 offsetLeft .offsetTop元素相对于文档左边和顶部的距离(定位 ...
- 关于scroll、client、offset和style中的height、width、top以及bottom属性
内容和图片来自offset.scroll.client三大家族, 此处仅作记录使用 client offset scroll
- HTML: width,height
在进行前端页面开发时,width(width,offsetWidth,scrollWidth,clientWidth)height(height,offsetHeight,scrollHeight,c ...
随机推荐
- wps取消英文首字母大写功能
wps中关于首字母大写的功能还是很有用处的,但是有时候对于我们来说却是一种累赘,怎么取消这个功能呢? 新建一个文档之后,点击wps文字,选择工具,选项按钮 然后点击编辑,取消勾选键入时自动进行首字母大 ...
- Educational Codeforces Round 43 E. Well played!(贪心)
E. Well played! time limit per test 1 second memory limit per test 256 megabytes input standard inpu ...
- [BZOJ1899]Lunch 午餐(DP)
[BZOJ1899] 首先有个很贪心的思路,吃饭时间长的最先打饭为最优,所以开始先排个序 然后考虑DP,我们不需要知道某个人在哪个对,只要关注总的时间就行了 肯定需要一维表示当前同学编号,还需要表示某 ...
- 九、MySQL 5.7.9版本sql_mode=only_full_group_by问题
MySQL 5.7.9版本sql_mode=only_full_group_by问题 用到GROUP BY 语句查询时com.mysql.jdbc.exceptions.jdbc4.MySQLSynt ...
- android 获取图片
Android获取手机或者内存卡里面的图片有两种方式 1.这是通过一种action Intent intent=new Intent(); intent.setAction(Intent.ACTION ...
- 【Java集合源码剖析】Java集合框架
Java集合工具包位于Java.util包下,包含了很多常用的数据结构,如数组.链表.栈.队列.集合.哈希表等.学习Java集合框架下大致可以分为如下五个部分:List列表.Set集合.Map映射.迭 ...
- javascript类式继承模式#2——借用构造函数
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/ ...
- android 摄像头相关使用记录
检测闪光灯是否存在 部分手机不存在闪光灯,检测是否存在还是有必要的. boolean hasFlash = this.getPackageManager().hasSystemFeature(Pack ...
- 玩转Linux之pwd命令
玩转Linux之pwd命令 你有没有遇到过需要知道当前所在目录却无从得知?有没有想要复制出当前所在目录层次却不知如何下手?俗话说有困难找警察,想知道目录层次自然要找pwd了.那么问题来了: 什么是pw ...
- Python 两种方式实现斐波那契数列
斐波那契数列指的是这样一个数列 1, 1, 2, 3, 5, 8, 13, 21, 34, 55, 89, 144, 233,377,610,987,1597,2584,4181,6765,10946 ...