offset系列

offset系列:以下5个属性返回值不带单位。

    el.offsetParent:(元素中带有最近定位的祖先元素)值有可能是父亲(position:relative),如果没有一直往上回溯祖先。

        区别:[parentnode:始终是上一级父亲]

    el.offsetTop:表示元素距离其offsetParent上方的偏移;

    el.offsetLeft:表示元素距离其offsetParent左边框的偏移;

   el.offsetWidth:表示元素实际宽度;

        包括:左右border+左右padding+width

    el.offsetHeight:表示元素实际高度;

        包括:上下border+上下padding+height

    con:

        offset              VS                 style

     获得数据无单位                         带单位的字符串

     任意样式                               只获取行内样式

     offsetWidth:包含3部分                 style.width:只包含width

[属于只读属性,ele.offsetWidth=300px;无效]   style.width:可读可写

client系列:结果不带单位

    可以动态获取元素边框大小、元素大小。{跟边框紧绑定}

    el.clientTop            :      返回元素上边框的宽度

    el.clientLeft                  返回元素左边框的宽度

    el.clientWidth                  返回元素宽度:padding+内容宽

    el.clientHeight                 返回元素高度:padding+内容高

scroll系列:结果不带单位

    el.scrollTop:          

    el.scrollLeft:         

    el.scrollWidth:         自身实际内容宽度,不包含边框

    el.scrollHeight:        自身实际内容高度,不包含边框


相对定位的元素并未脱离文档流,而绝对定位的元素则脱离了文档流。在布置文档流中其它元素时,绝对定位元素不占据空间。

相对定位的元素是在文档中的正常位置偏移给定的值,但是不影响其他元素的偏移。

固定定位与绝对定位相似,但元素的包含块为 viewport 视口。该定位方式常用于创建在滚动屏幕时仍固定在相同位置的元素。

粘性定位可以被认为是相对定位和固定定位的混合。元素在跨越特定阈值前为相对定位,之后为固定定位

posted @ 2020-06-05 19:34  小海_macro  阅读(232)  评论(0编辑  收藏  举报