盒子模型

49 阅读1分钟

(1)el.offsetWidth:本身宽度+边框线+左右内边距;
(1) el.offsetHeight:本身高度+边框线+上下内边距;
(1) el.offsetTop:相对第一个父级节点有定位属性的上偏移量;
(1) el.offsetLeft:相对有定位属性的父节点左偏移量;
(1)el.clientWidth:本身的宽度+左右内边距;
(1)el.clientHeight:本身的高度+上下内边距;
(1)el.clientTop:上边框线的宽度
(1)el.clientLeft:左边框线的宽度
(1) el.scrollWidth:盒子的实际宽度(包括滚动条不可见部分,不包括边线)
(1)el.scrollHeight:盒子的实际高度(包括滚动条不可见部分,不包括边线)
(1) el.scrollTop:滚动条向下滚动的距离;
(1)el.scrollLeft:滚动条向右滚动的距离;
(1) window.innerHeight:浏览器窗口可见区域高度;
(1)window.innerWidth:浏览器窗口可见区域宽度;

box.png