正文

不同情况

  • 没有已定位的父节点,且自身position:relative的DIV元素的offsetParent为BODY
  • 没有已定位的父节点,且自身position: absolute的DIV元素的offsetParent为BODY
  • 没有已定位的父节点,且自身position: fixed的DIV元素的offsetParent为BODY
  • 没有已定位的父节点,且自身position: static的DIV元素的offsetParent为BODY
  • 拥有一个已定位的父节点,且自身position:
    relative的DIV元素的offsetParent为其最近被定位的祖先
  • 拥有一个已定位的父节点,且自身position:
    absolute的DIV元素的offsetParent为其最近被定位的祖先
  • 拥有一个已定位的父节点,且自身position: fixed的DIV元素的offsetParent为BODY
  • 拥有一个已定位的父节点,且自身position:
    static的DIV元素的offsetParent为其最近被定位的祖先
  • 在table之内,td与table都没有定位,且自身position:
    relative的DIV元素的offsetParent为BODY
  • 在table之内,td与table都没有定位,且自身position:
    absolute的DIV元素的offsetParent为BODY
  • 在table之内,td与table都没有定位,且自身position:
    fixed的DIV元素的offsetParent为BODY
  • 在table之内,td与table都没有定位,且自身position:
    static的DIV元素的offsetParent为其最近的TD、TH元素
  • 在table之内,td相对定位,且自身position:
    relative的DIV元素的offsetParent为其最近的TD、TH元素
  • 在table之内,td相对定位,且自身position: absolute的DIV元素的offsetParent为BODY
  • 在table之内,td相对定位,且自身position: fixed的DIV元素的offsetParent为BODY
  • 在table之内,td相对定位,且自身position:
    static的DIV元素的offsetParent为其最近的TD、TH元素
  • 在table之内,table相对定位,且自身position:
    relative的DIV元素的offsetParent为其最近的TABLE元素
  • 在table之内,table相对定位,且自身position:
    absolute的DIV元素的offsetParent为其最近的TABLE元素
  • 在table之内,table相对定位,且自身position: fixed的DIV元素的offsetParent为BODY
  • 在table之内,table相对定位,且自身position:
    static的DIV元素的offsetParent为其最近的TD、TH元素

总结

  1. position为fixed元素是没有offsetParent,但firefox统一返回body。
  2. position为absolute, relative的元素的offsetParent总是为其最近的已定位的元素,
    没有找最近的td,th元素,再没有找body。
  3. position为static的元素的offsetParent则是先找最近的td,th元素,再没有找body。
  4. body为最顶层的offsetParent。

个人观点

用的比较多的是在没有table的情况下。所以很好记得。

[转] offsetParent 到底是哪一个?的更多相关文章

  1. offsetParent 到底是哪一个?

    前言 温故而知新.遇到offsetParent这个知识点,发现书上讲的不够详细.于是看了看豪情的博客,发现讲得很具体,收藏一下. 正文 不同情况 没有已定位的父节点,且自身position:relat ...

  2. 容器(vector)、数组、new创建的动态数组,你到底用哪一个(执行效率分析)

    1.问题的提出 在没有了解vector之前,动态数组一般都是又new创建的.在了解vector后发现vector竟是那样方便好用,但方便的同时却是以牺牲执行效率为代价的.网上对vector和array ...

  3. Java学习----到底调用哪一个方法(多态)

    public class Father { public void print() { System.out.println("Father:print()"); } } publ ...

  4. 做量化模型Matlab、R、Python、F#和C++到底选择哪一个?

    MATLAB是matrix&laboratory两个词的组合,意为矩阵工厂(矩阵实验室).是由美国mathworks公司发布的主要面对科学计算.可视化以及交互式程序设计的高科技计算环境.它将数 ...

  5. 后移动互联网时代:到底还要不要开发一个App?

    后移动互联网时代,到底是什么样的一个时代? 首先,后移动互联网时代中,产生头部应用的几率变小了,像微信这样巨头式的App很难在产生第二个.其次,后移动互联网时代,物联网发展迅速,所有的智能硬件都需要一 ...

  6. CVE-2013-1347:从入门到放弃之调试分析令人崩溃的 Microsoft IE CGenericElement UAF 漏洞

    0x01 2013 年 "水坑" APT 攻击事件 在 2013 年 5 月,美国的劳工部网站被黑,利用的正是 CVE-2013-1347 这个漏洞,在当时导致大量使用 IE8 访 ...

  7. C# MVC 5 - 生命周期(应用程序生命周期&请求生命周期)

    本文是根据网上的文章总结的. 1.介绍 本文讨论ASP.Net MVC框架MVC的请求生命周期. MVC有两个生命周期,一为应用程序生命周期,二为请求生命周期. 2.应用程序生命周期 应用程序生命周期 ...

  8. Javascript 严格模式详解

    转自http://www.ruanyifeng.com/blog/2013/01/javascript_strict_mode.html 一.概述 除了正常运行模式,ECMAscript 5添加了第二 ...

  9. Apache Cordova开发Android应用程序——番外篇

    很多天之前就安装了visual studio community 2015,今天闲着么事想试一下Apache Cordova,用它来开发跨平台App.在这之前需要配置N多东西,这里找到了一篇MS官方文 ...

随机推荐

  1. linux命令行打包、压缩及解压缩

    使用命令: tar 打包: tar -zcvf  目标文件 源文件或文件夹 目标文件为要打包成的文件的文件名, 打包后文件的 格式取决于目标文件的后缀名 单文件或文件夹打包 tar -zcvf ind ...

  2. 78. Subsets(M) & 90. Subsets II(M) & 131. Palindrome Partitioning

    78. Subsets Given a set of distinct integers, nums, return all possible subsets. Note: The solution ...

  3. linux command ------ source

    source FileName 等效于. FileName,注 . 和 FileName 有空格 source命令也称为“点命令”,也就是一个点符号(.),作用是在当前bash环境下读取并执行File ...

  4. Access时间日期函数大全

    这里特别推荐WeekdayName() 函数.MonthName() 函数,将日期转换为中文星期名与月份,如"星期一"."五月"一.Date() 函数.Now( ...

  5. css拾遗(一)(inline-block,absolute)

    一:inline-block中不要嵌套其他block标签,不然会破坏布局 <style> .left{ float:left; } .hide{ display:none; } a{ di ...

  6. SQL记录-PLSQL-EXIT/CONTINUE/GOTO

    PL/SQL EXIT语句   在PL/SQL编程语言中,EXIT语句有以下两种用法: 当循环中遇到EXIT语句循环立即终止,程序控制继续下一个循环语句后面. 如果使用嵌套循环(即一个循环内的另一个循 ...

  7. Linux通过ssh登录其他服务器,不用输入密码

    有A(192.168.10.163)和B(192.168.10.164)两台服务器,为了使A服务器通过SSH连接B服务器时,免密登录,做以下操作. 1. 登录A(192.168.10.163)服务器( ...

  8. Codeforces Round #547 (Div. 3) D

    http://codeforces.com/contest/1141/problem/D 题目大意: 鞋子匹配,用一个小写字母表示一种颜色.L[i]表示左脚的颜色,R[i]表示右脚的颜色,只有当L[i ...

  9. python学习笔记6--双色球需求实现

    # 5,随机产生5条双色球号码 # blue 存蓝色的求 01,02 # red 存红色的求 17,16,03 # date存生成的时间,精确达到秒 #处理 import random,datetim ...

  10. WordPress中使用Markdown和Syntax Highlighter

    下载安装插件 在wordpress插件中安装WP Code Prettify. PHP Markdown Extra 下载Extra,并上传安装到wordpress. Code Prettify th ...