CSS 浮动和定位

CSS Position(定位)
CSS position 属性，允许您将布局的一部分与另一部分重叠，还可以完成多年来通常需要使用多个表格才能完成的任务。
position 属性指定了元素的定位类型。
position 属性的五个值：
static：默认值，没有定位，元素出现在正常的流中，静态定位的元素不会受到 top, bottom, left, right影响。
absolute：绝对定位，相对于最近的已定位父元素，如果元素没有已定位的父元素，那么它的位置相对于，元素和其他元素重叠。
relative：相对定位，相对其正常位置，(相对灵活，按元素自己的位置)，相对定位元素的定位是相对其正常位置。
http://www.iis7.com/b/plc/
fixed：固定定位，即使窗口是滚动的它也不会移动，注意：Fixed定位在IE7和IE8下需要描述!DOCTYPE才能支持.Fixed定位使元素的位置与文档流无关，因此不占据空间，Fixed定位的元素和其他元素重叠。
sticky：可以把它称之为粘性定位，依赖于用户的滚动，在 position:relative 与 position:fixed 定位之间切换
元素可以使用的顶部，底部，左侧和右侧属性定位。然而，这些属性无法工作，除非是先设定position属性。他们也有不同的工作方式，这取决于定位方法
z-index：指定了一个元素的堆叠顺序（哪个元素应该放在前面，或后面），一个元素可以有正数或负数的堆叠顺序，具有更高堆叠顺序的元素总是在较低的堆叠顺序元素的前面。
clip:rect：裁剪元素，先有定位
overflow:scroll：内容溢出时，显示隐藏内容
overflow:hidden：内容溢出时，隐藏
overflow:auto：自动处理溢出内容
overflow-x：指定如何处理右边/左边边缘的内容溢出元素的内容区域。值：auto，hidden，scroll，visible，no-display，no-content
overflow-y：指定如何处理顶部/底部边缘的内容溢出元素的内容区域。值：auto，hidden，scroll，visible，no-display，no-content
。。。。。。
CSS float(浮动)
CSS float 属性定义元素在哪个方向浮动，浮动元素会生成一个块级框，直到该块级框的外边缘碰到包含框或者其他的浮动框为止。
浮动，可以让行内和块变成行内块
浮动，会使元素向左或向右移动，其周围的元素也会重新排列。
浮动，往往是用于图像，但它在布局时一样非常有用
元素的水平方向浮动，意味着元素只能左右移动而不能上下移动。
一个浮动元素会尽量向左或向右移动，直到它的外边缘碰到包含框或另一个浮动框的边框为止。
浮动元素之后的元素将围绕它。
浮动元素之前的元素将不会受到影响。
如果图像是右浮动，文本流将环绕在它左边
如果你把几个浮动的元素放到一起，如果有空间的话，它们将彼此相邻
清除浮动 - 使用 clear
元素浮动之后，周围的元素会重新排列，为了避免这种情况，使用 clear 属性。
clear 属性指定元素两侧不能出现浮动元素。
1.

浮动清除
2.overflow：hiddc，auto