CSS样式中position说明及用法示例

来源：百度文库编辑：神马文学网时间：2024/04/28 05:55:14

CSS定位position语法：
　　position : static | absolute | fixed | relative
　　取值：
　　static:默认值。无特殊定位，对象遵循HTML定位规则。
　　absolute:将对象从文档流中拖出，使用left，right，top，bottom等属性相对于其最接近的一个最有定位设置的父对象进行绝对定位。如果不存在这样的父对象，则依据body对象。而其层叠通过z-index属性定义。
　　fixed:未支持。对象定位遵从绝对(absolute)方式。但是要遵守一些规范。
　　relative:对象不可层叠，但将依据left，right，top，bottom等属性在正常文档流中偏移位置。
　　说明：检索对象的定位方式。
　　设置此属性值为absolute会将对象拖离出正常的文档流绝对定位而不考虑它周围内容的布局。假如其他具有不同z-index属性的对象已经占据了给定的位置，他们之间不会相互影响，而会在同一位置层叠。此时对象不具有外补丁(margin)，但仍有内补丁(padding)和边框(border)。
要激活对象的绝对(absolute)定位，必须指定left，right，top，bottom属性中的至少一个，并且设置此属性值为absolute。否则上述属性会使用他们的默认值auto，这将导致对象遵从正常的HTML布局规则，在前一个对象之后立即被呈递。
　　设置此属性值为relative会保持对象在正常的HTML流中，但是它的位置可以根据它的前一个对象进行偏移。在相对(relative)定位对象之后的文本或对象占有他们自己的空间而不会覆盖被定位对象的自然空间。
与此不同的，在绝对(absolute)定位对象之后的文本或对象在被定位对象被拖离正常文档流之前会占有它的自然空间。放置绝对(absolute)定位对象在可视区域之外会导致滚动条出现。而放置相对(relative)定位对象在可视区域之外，滚动条不会出现。
　　内容的尺寸会根据布局确定对象的尺寸。例如，设置一个div对象的height和position属性，则div对象的内容将决定它的宽度(width)。此属性对于currentStyle对象而言是只读的。对于其他对象而言是可读写的。对应的脚本特性为position。
　　示例：
　　div { position:relative; top:-3px }

CSS样式中position说明及用法示例 CSS中background-position属性说明 CSS样式中zoom的含义及用法 CSS样式中!important的用法讲解 css 样式 css样式 Linux中find常见用法示例 Linux中find常见用法示例 CSS鼠标样式大全及使用方法（非常实用） CSS鼠标样式大全及使用方法（非常实用）网页布局中CSS样式无效的十个重要原因 _ CSS教程层叠样式表 css 实时切换CSS样式实时切换CSS样式 css样式表简价 css样式设计技术 CSS教程:实例讲解定位Position 请教CSS中的position:relative;的作用。 CSS条件注释示例 css+div 示例式 Dreamweaver中层叠样式定义及创建甲泼尼龙片用法及说明 vb中print方法详解及示例 C++中exit语句的用法说明