相对是位置的一个属性，是相对定位。本文介绍了位置属性的相对用法，对位置属性相关知识感兴趣的朋友可以一起学习。

相对是位置的一个属性，是相对定位。

position的缺省值是static，(也就是说，对于任何元素，如果它的position属性没有定义，那么它的position:static)

如果你想让这个#demo中的一个div#sub相对于#demo定位在右上角的某个地方，你应该相对定位#demo，绝对定位#sub。

Absolute相对于其最近的父元素定位。如果不给#demo一个相对位置，那么#sub的绝对位置就是相对于body定位的。

Relative相对于自身定位，例如：# demo { position:relative；top:-50px；}，那么#demo会相对于原来的位置上移50px。

另外，相对不是从文档流中分离出来的，绝对是从文档流中分离出来的。也就是说，relative的元素虽然表面上偏离了原来的位置，但实际上在文档流中保持不变。absolute的元素不仅改变了它们的位置，而且脱离了文档流。

Position:relative在日常应用中一般设置为position:absolute；的父层的，父层位置：相对；副处级职位：绝对；它根据父层的边界定位；否则，position:absolute将逐层搜索position:relative元素集的边界，直到body元素。

写一个例子如下：

Html代码

静态：默认值。没有特殊定位，对象遵循HTML定位规则。

Absolute:将对象拖出文档流，并使用左、右、上、下等属性。相对于具有最多定位设置的最近父对象进行绝对定位。

如果没有这样的父对象，则依赖于body对象。它的堆栈由z-index属性定义。

已修复：不支持。对象定位遵循绝对方式。但是有一些规则要遵守。

相对：对象不能堆叠，但是它们将根据左、右、上、下和其他属性在正常的文档流中偏移。

quality=' high ' type=' application/x-shock wave-flash ' plugin page=' http://www . macromedia . com/go/getflash player '

！DOCTYPE html PUBLIC '-//W3C//DTD XHTML 1.0 Strict//EN ' ' http://www . w3 . org/TR/XHTML 1/DTD/XHTML 1-Strict . DTD '

html xmlns=' http://www . w3 . org/1999/XHTML '

头

meta http-equiv=' content-type ' content=' text/html；charset=utf-8 '

头衔职位/头衔

style type='text/css '

！-

正文{

字体大小：12px

边距：0自动；

}

div #演示{

位置：相对；

边框：1px纯色# 000；

边距：50px

top:-50px；

行高：18px

溢出：隐藏；

明确：两者都有；

身高：1%；

}

部门#sub{

位置：绝对；

右：10px

top:10px；

}

相对部门{

位置：相对；

左：400px

top:-20px；

}

静态分区、固定分区、绝对分区、相对分区{

宽度：300px

}

静态分区{

背景色：# bbb

位置：静态；

}

部门固定{

背景色：# ffc 0 CB；

}

绝对分区{

背景色：# b0c4de

}

相对部门{

背景色：# ffe4e1

}

-

/风格

/头

身体

div id='demo '

Div=' static' static:默认值。没有特殊定位，对象遵循HTML定位规则/div。

div=' sub ' class=' absolute ' absolute:将一个对象拖出文档流，并使用左、右、上、下等属性。相对于具有最多定位设置的最近父对象进行绝对定位。如果没有这样的父对象，则依赖于body对象。它的堆栈由z-index属性/div定义。

不支持。对象定位遵循绝对方式。但是有一些规则/div要遵守。

Class=' relative' relative:对象不能堆叠，但是在正常的文档流中会根据左、右、上、下等属性进行偏移。/div。

/div

/body

/html

以上是边肖共享的位置属性的相对用法的完整说明。我希望你喜欢它。

郑重声明：本文由网友发布，不代表盛行IT的观点，版权归原作者所有，仅为传播更多信息之目的，如有侵权请联系，我们将第一时间修改或删除，多谢。