CSS父子DIV绝对定位和相对定位的位置关系是怎样的?_html/css

CSS父子DIV绝对定位和相对定位的位置关系是怎样的?_html/css_WEB-ITnose

php中文网

发布： 2016-06-21 08:53:44

原创

2790人浏览过

有两种情况:

1)如果父div采用相对定位，其子div只能采用绝对定位吗？（根据我的理解：子div永远浮于父div之上）

2)如果父div采用绝对定位,那么可以定义其子div吗?

标书对比王

标书对比王是一款标书查重工具，支持多份投标文件两两相互比对，重复内容高亮标记，可快速定位重复内容原文所在位置，并可导出比对报告。

查看详情

回复讨论(解决方案)

绝对定位如果父级不使用position:relative，而直接使用position:absolute绝对定位，这个时候将会以body标签为父级，使用position:absolute定义对象无论位于DIV多少层结构，都将会被拖出以

为父级（参考级）进行绝对定位。

父级定义position:relative定位，子级定义position:absolute绝对定位属性，并且子级使用left或right和top或bottom进行绝对定位

绝对定位是以body标签为目标

相对定位是以父级标签为目标

别误导人，相对定位是相对于自身目前所在的位置，绝对定位是相对于父元素是否用了定位，父元素用了就依据父元素来定位，如果父元素没有就一直往父、父、父、、、元素，看看祖先元素哪个用了定位（只要是用了定位样式就可以），就依据用了定位的祖先元素定位。

这么说吧，绝对定位：如果父元素用了定位样式，就根据父元素来定位，如果父元素没用定位样式，而爷元素用了定位样式，就以爷元素定位，如果爷爷还没有用定位样式？就看看爷爷的父（曾字辈）用了定位样式没有，如果用了就以曾字辈定位，如果一直往上找没有祖先元素用定位样式。那就以body为定位了。

如果绝对定位的元素没有父元素，那么将来trbl是相对于body来定位的；
如果绝对定位的元素有父元素，但是父元素没有定位，那么这个时候trbl还是相对于body来定位的。
如果绝对定位的元素有父元素，而且父元素有定位（非static），那么这个绝对定位的元素偏移是以自己的父元素为基础。
绝对定位的元素会脱离标准流，在页面不会占据位置。

大家都在看：

html新闻链接怎么打_html新闻链接如何打完整说明 html本地存储缓存怎么清理_html本地存储缓存清理的全面说明 html如何增加边框_HTML元素边框（border样式）添加方法 HTML5在线如何制作抽奖转盘 HTML5在线互动活动的开发指南如何在云端平台上编辑HTML表单元素的详细教程