时间:2021-07-01 10:21:17 帮助过:27人阅读
position:static | relative | absolute | fixed
取值:
static:无特殊定位,对象遵循正常文档流。top,right,bottom,left等属性不会被应用,默认值。
relative:对象遵循正常文档流,但将依据top,right,bottom,left等属性在正常文档流中偏移位置。
absolute:对象脱离正常文档流,使用top,right,bottom,left等属性进行绝对定位。而其层叠通过z-index属性定义。
fixed:对象脱离正常文档流,使用top,right,bottom,left等属性以窗口为参考点进行定位,当出现滚动条时,对象不会随着滚动。IE6不支持此属性值。
浏览器支持:
IE浏览器支持此属性。
火狐浏览器支持此属性。
谷歌浏览器支持此属性。
opera浏览器支持此属性。
注意:IE6不支持fixed属性值。
继承性:
没有继承性。
实例代码:
实例一:
position属性-蚂蚁部落 蚂蚁部落欢迎您
static是对象的默认定位值,无任何特殊定位,所以top属性将会被忽略。
实例二:
position属性-蚂蚁部落 我是第一个孩子我是第二个孩子
first对象进行相对定位,它所相对的元素就是它自己本身的位置。而second的对象不会受到first对象的影响,依然会呆在它原来的地方。
实例三:
position属性-蚂蚁部落 我是第一个孩子我是第二个孩子
以下代码可以看出绝对定位对象的参考对象并非都是body或者它的最近得父对象,而是距离它最近的带有position属性并且属性值不为static的父对象。下面的first对象就是以grandfather作为偏移参考对象的。
实例四:
密码强度提示功能-蚂蚁部落 我是第一个孩子我是第二个孩子
postion的fixed定位永远是以body作为偏移参考对象的。
原文地址是:CSS的position属性一章节。