zoukankan      html  css  js  c++  java
  • JS盒子模型

     6.JS盒子模型:3X4+1 =13 个属性

    client系列: 

      clientHeight/clientWidth:内容的宽度/高度+左右/上下填充(padding)和内容溢出没有关系(不包括边框高度)

      clinetTop:上边框的高度

      clinetLeft:左边框的宽度

    offset系列:

       offsetWidth/offsetHeight:clientWidth/clientHeight+左右/上下边框

        offsetParent:当前元素的父级参照物

        offsetTop/offsetLeft:当前元素的外边框距离父级参照物的内边框距离的偏移量

    scroll系列:

       scrollWidth/scrollHeight:和clientWidth/clientHeight一样(前提是内容没有溢出)

        如果内容有溢出(设置overflow=hidden后)

       scrollWidth:真实内容的宽度(包含溢出)+左填充

       scrollHeight:真实内容的高度(包含溢出)+上填充

       scrollLeft/scrollTop:滚动条卷去的宽度/高度

    浏览器盒子模型兼容写法

     function win(attr,value){
                if(typeof  value ==='undefined' ){
                return document.documentElement[attr]||document.body[attr];
                }
               document.documentElement[attr]=value;
               document.body[attr] = value;
           }
  • 相关阅读:
    UVA10891
    UVA10453
    UVA 10201
    UVA10154
    UVA11137
    UVA10617
    UVA10271
    UVA10739
    UVA10306
    节流防抖
  • 原文地址:https://www.cnblogs.com/zzzzzzzsy/p/6852238.html
Copyright © 2011-2022 走看看