元素的大小和位置

一、两个宽度

首先，抛开chrome、firefox、ie等浏览器兼容性的限制，在这里说明两个概念：元素内容区宽度，元素所占宽度。

在Firefox中，内容区宽度即width指定；元素所占宽度包含内容区宽度和 内边距，以及边框的宽度。

那么，外边距margin是个什么概念，有什么作用呢。margin本意页边，是个定位的概念。margin已经和元素所占宽度没有任何关系

了，只是让元素与周围元素产生距离。于是，可以有一个小总结：padding是一个元素所占大小的概念，margin是个定位的概念。

二、偏移量offset 

偏 移量是个元素相对元素的概念,这一点和绝对定位非常相似。

元素相对于其父元素偏移，而其父元素必须满足定位属性不为static，即positon为 relative,absolute,fixed即可。并且，如果父元素

不满足，则向祖先寻找，最终可以是body。

offsetLeft表达的是元素所占区域的左边缘到父元素的左边缘

三、客户区client

clientWidth:元素内容区宽度和内边距的总和

四、 滚动大小 Scroll

scrollWidth:元素内容的总宽度，或铺开的宽度。

scrollLeft:因水平滚动条而隐藏的宽度。