CSS定位属性position

CSS定位属性position

position属性用来决定元素在页面上的位置，其定位属性有多个，这个属性定义建立元素布局所用的定位机制。任何元素都可以定位，不过绝对或固定元素会生成一个块级框，而不论该元素本身是什么类型。相对定位元素会相对于它在正常流中的默认位置偏移。加入逆战班学习第14天，下面一一为大家介绍下，希望大家在使用过程中可以用到

• static

• static属性是position的默认值，元素框正常生成。块级元素生成一个矩形框，作为文档流的一部分，行内元素则会创建一个或多个行框，置于其父元素中。

• absolute

• 元素框从文档流完全删除，并相对于其包含块定位。包含块可能是文档中的另一个元素或者是初始包含块。元素原先在正常文档流中所占的空间会关闭，就好像元素原来不存在一样。元素定位后生成一个块级框，而不论原来它在正常流中生成何种类型的框。

• relative

• 元素框偏移某个距离。元素仍保持其未定位前的形状，它原本所占的空间仍保留。我们常常取相对定位值的元素通常作为取绝对定位值元素的父级容器。

• fixed

• fixed定位用的不多，但是它非常适用于固定模式的部分制作，比如顶部菜单。定义了fixed属性后，元素的位置不会随着任何行为发生变化。

• clear

• 使用clear可以清除float产生的浮动，有的时候定位会出现塌陷现象，即子元素在父元素中，但是父元素的大小不会随着子元素的大小而被“”撑开“，导致了父元素的塌陷效果。这种bug的出现是由于子元素设定了 float属性，导致父元素的坍塌。要想解决这种bug，需要为父元素设定清除浮动。而一般常用clear:both来清除浮动。