css定位 初总结

1.      属性position可能的值

(1)    static 元素框正常生成。块级元素生成一个矩形框，作为文档流的一部分，行内元素则会创建一个或多个行框，置于其父元素中

(2)     relative 相对定位用法一:元素相对自身的原位置进行偏移，但是原本的空间依旧保留，表现为空白。用法二:把一个元素设置为position:relative;可以使该元素的子元素相对该元素绝对定位。

(3)     absolute 绝对定位元素框从文档流完全删除，并相对于其包含块定位。元素原先在正常文档流中所占的空间会关闭，就好像元素原来不存在一样。元素定位后生成一个块级框，而不论原来它在正常流中生成何种类型的框。包含块:最近的position值不是static的祖先元素，一般会指定一个元素作为绝对定位元素的包含块。因为绝对定位的框与文档流无关，所以它们可以覆盖页面上的其它元素。可以通过设置z-index属性来控制这些框的堆放次序。

(4)     fixed 固定定位; 元素从文档流删除，并相对于浏览器视窗定位，因此不随文档滚动而移动。元素在原本的空间关闭。元素定位后生成一个块级框，不论它原来是行内元素还是块级元素。与绝对定位的区别仅仅是包含块不同。

包含块：浏览器视窗。

2.浮动

(1)     float 浮动浮动的框可以向左或向右移动，直到它的外边缘碰到包含框或者另一个浮动框的边框为止，由于浮动框不在文档的普通流中，所以文档的普通流中的块框表现得就像浮动框不存在一样。可能的值(left|right|none)

(2)      clear 属性规定元素的哪一侧不允许其他浮动元素。可能的值(left,在左侧不允许浮动元素|right|both,在左右两侧均不允许浮动元素|none)