CSS 有关Position = absolute (绝对定位 是相对于谁而言)

 

CSS 有关Position = absolute (绝对定位 是相对于谁而言)

css中有绝对定位法,以前一直搞不懂绝对定位是相对于谁而言的绝对定位。

 

现在搞清楚了,不是相对于父元素,也不是相对于BODY。

 

而是相对于所属元素树中,相邻最近的那个显示标识了position属性的元素。

 

比如

 


<div id="a" style="position:relative">
  <div id="b">
    <div id="c" style="position:absolute">
    </div>
  </div>
</div>

 

div#c就是根据div#a进行绝对定位。

时间: 2024-10-31 12:30:56

CSS 有关Position = absolute (绝对定位 是相对于谁而言)的相关文章

CSS 中 position:absolute 与 z-index 对层次结构影响

css 不使用 position 这种情况下每一层都遵循 HTML 定位规则,其中的 left,right,top,bottom 定位信息对其无效,z-index 也不会发挥作用因为没有层叠的情况出现. 2. 使用 absolute 如两个绝对定位对象的 z-index 属性具有同样的值,那么将依据它们在HTML文档中声明的顺序层叠. 2.1 未使用 z-index 这种情况下,依据它们在HTML文档中声明的顺序层叠,因为 z-index 在未设置的情况下,默认为 0 . <div id = &qu

解决CSS的position:absolute中left效果

有时候css中设置了position:absolute,left:100px,但是如果我们不想要这个left怎么办呢,当然你直接删除就可以,但是如果是框架的css,你直接删除就有问题了,这时候该怎么办呢?解决办法很简单,你只要再定义一个class然后设置 left:auto就可以,是不是很简单,你现在就可以试试!!!

[HTML/CSS]说说position

目录 语法 作用 使用定位的条件 总结 语法 position : static absolute relative(static.absolute.relative常用值). 参数 static :无特殊定位,对象遵循HTML定位规则. absolute :将对象从文档流中拖出,使用left,right,top,bottom等属性进行绝对定位.而其层叠通过css z-index属性定义.此时对象不具有边距,但仍有补白和边框. relative :对象不可层叠,但将依据left,right,to

css中position相对定位和绝对定位(relative,absolute)详解

在CSS中有这样的一个指令:(position) 在DW中文版中翻译为"定位",常用的属性有relative(相对)与 absolute(绝对). 有很多朋友对这条指令的用法还是不清楚,这里做一定细致的讲解: position:relative; 表示相对定位,被定位了这个属性的标签在所属的范围内可以进行上下左右的移,这里的移动与padding或是margin所产生的位置变化是不一样的.padding与margin是元素本身的一种边距与填充距离并不是真正的移动,而被定义为relativ

css IE6 position:fixed (固定定位)通过position:absolute的解决方案

css教程 ie6 position:fixed (固定定位)通过position:absolute的解决方案,完全使用position:absolute来解决固定定位问题.因为其他的浏览器都支持绝对定位,在ie6,7,8,9,ff,chrome中均测试通过.注意一点:不能给外包含的元素mod-test设置高度,不然的话,是没有滚动条的.而应该在里面设置一个容器,它设置一个高度  <!doctype html public "-//w3c//dtd xhtml 1.0 transition

CSS教程:position 绝对定位的问题

今天做页的时候,遇到了一个问题:div无法对父对象绝对定位. <div id="fa">      <div id="so" style="position:absolute; top:0; right:12px">      </div> </div>   但是发现无论怎么调整都是针对body定位,郁闷!   看了下css手册,也没发现有什么不对.到网上查了下,发现了这么一句话:absolute

IE下绝对定位(position:absolute)失效

IE(包括IE10等)下绝对定位(position:absolute)a标签或者其它标签失效,很明显这是一个很神奇的bug,在该情况下,z-index,等等属性皆会失效.但是给这个标签加上一些熟悉又没事了. 这个应该跟文档模式有关,具体,等有空在研究 CSS:  代码如下 复制代码 a{     /* 加背景颜色 */     background-color: #000;     /* 或者加边框 */     border: 1px solid #fff;     /* 或者加背景图片*/

css父级position:absolute;那么子元素的高度如何调整

问题描述 css父级position:absolute;那么子元素的高度如何调整 比如一个div是父级.position:absolute;是它的一个子元素,当我设置它的样式为margin-top: 20px;时,它的高度却没有变化:求解答. 解决方案 http://luyumiao1990.blog.163.com/blog/static/2134162282013111835242580/

CSS定位position之static relative absolute float用法

1. position:static 元素的 position 属性默认值为:static,即该元素出现在文档的常规位置,不会重新定位. 通常此属性值可以不设置,除非是要覆盖之前的定义.  代码如下 复制代码 #div-1 {  position:static; } 2. position:relative 设置了 position:relative,便可以结合top . bottom. left . right 的属性来偏移其文档的常规位置. 例如将 div-1 向下移动 20 像素.向左移动