zoukankan      html  css  js  c++  java
  • JQUERY 获取 DIV 宽度与高度(width,padding,margin,border)

    一般讲的宽度指的是内容宽度,但一个 div 的实际宽度不仅只于内容宽度,尤其在做 CSS 排版时更不能搞错,必须同时考虑 Padding、Border 与  Margin 的宽度,四个加起来才是 div 真正占有的宽度。

    JQUERY 获取 DIV 宽度与高度(width,padding,margin,border)全都有了!

    var content = $(‘div’). width();//只是获取content宽度

    var contentWithPadding = $(‘div’). innerWidth();//获取content+padding的宽度

    var withoutMargin = $(‘div’). outerWidth();//获取content+padding+border的宽度

    var full = $(‘div’). outerWidth(true);//获取content+padding+border+margin的宽度

     

    宽度与高度概念一样,只差水平与垂直向而已。

    Margin 有个特色,就是当两个有 margin的 div 靠在一起时,两个 div 紧邻的 margin 不是相加,而是取其大者,举例来说,两个 10px margin 的 div 并在一起只会有 10px margin 的距离,若是一个 20px margin,另一个为 10px margin,则会有 20px 的 margin。

    但是获取当前元素的全部宽度的时候,还是获取自身的margin+content+padding+border的值。

  • 相关阅读:
    CSS截取字符串
    mysql数据库中列转行
    Html页面操作json串
    mysql批量上传数据
    常见的表单元素选中
    关于Connection must be valid and open.
    百度editor调用【图片上传阿里云】
    百度apistore第三方登陆
    如何提高网页运行性能
    Html页面加回滚
  • 原文地址:https://www.cnblogs.com/agansj/p/7840821.html
Copyright © 2011-2022 走看看