WEB程序设计之CSS（三）

WEB程序设计之CSS（三）

CSS定位

CSS 有三种基本的定位机制：普通流、浮动和绝对定位。

除非专门指定，否则所有框都在普通流中定位。也就是说，普通流中的元素的位置由元素在 X(HTML) 中的位置决定。

块级框从上到下一个接一个地排列，框之间的垂直距离是由框的垂直外边距计算出来。

浮动定位：可以设置元素的float属性为left或right，才设置元素浮动，使得块级元素可以并排显示。

但一定注意，设置浮动的同时一定要先设置块状元素的宽度，且需要浮动的几个元素宽度加起来一定要小于容器元素的宽度。

position属性：

static

position的默认值，一般不设置position属性时，会按照正常的文档流进行排列

relative

元素框相对于原本的位置偏移某个距离。元素仍保持其未定位前的形状，它原本所占的空间仍保留

absolute

当元素的父对象(或曾祖父，只要是父级对象)parent的position属性不是默认值的情况，此时按照这个parent来进行定位，如果没有这个对象，相对body元素定位

fixed

总是以body为定位对象的，按照浏览器的窗口进行定位

float浮动与清除请参考：