在网页设计时经常要对网页中的元素进行排版和优化。这时就要用到定位和浮动，来帮我们达到理想的效果。所以要清楚各种定位之间的关系和用法。
css中的相对定位：
如果对一个元素进行相对定位，它将出现在它所在的位置上。这个元素的移动是“相对于”它的起点进行移动。
书写格式： 选择器 {
position:relative;
top: 20px;
left: 100px;
}
注意。使用相对定位时，无论是否进行移动，元素依然占据原来的空间。因此，移动元素会导致它覆盖其他框。
css中的绝对定位：
绝对定位使元素的位置与文档流无关，因此不占据空间。所以与相对定位不同，相对定位实际上被看作标准文档流定位模型的一部分，因为元素的位置相对于它在标准文档流中的位置。
书写格式：
选择器 {
position:relative;
top: 20px;
left: 100px;
}
绝对定位的元素的位置相对于最近的已定位祖先元素，如果元素没有已定位的祖先元素，那么它的位置相对于最初的包含块（最初的包含块可能是整个网页的起始点）。
提示：因为绝对定位的框架与标准文档流无关，所以他们可以覆盖页面上的其他元素。可以通过 选择器{
position：relative；
z-index：数字；}
来控制这写框的堆放次数。
css固定定位：
固定定位就是让元素固定在网页的相对位置上。通俗点讲，例如网页的导航栏我们给它设定固定定位在顶部，那么不论用户怎么上下滑动滚动条该导航栏始终在我们看到的页面上方。
书写格式：
选择器{
position:fixed;
top: 50px;
left: 60px;
}
该定位一般用于脚注或者导航栏。
css的float（浮动）属性（脱离了标准文档流）：
书写格式：选择器{
float:left；
}
float两个属性值 right 和 left
1 子级浮动会导致父级元素坍陷。
2 包裹性（若浮动元素没有设置宽或高，该元素会折叠道最小宽或高）
3 元素浮动后 横向的margin会叠加。
4 浮动元素会影响其他元素的布局，位置。
注意：对同一个元素不能同时进行float（浮动）和定位。