CSS：CSS定位和浮动

CSS2.1规定了3种定位方案

1.Normal flow：普通流(相对定位 position relative、静态定位 position static)

　　普通流（normal flow，国内有人翻译为文档流）：普通流默认是静态定位，将窗体自上而下分成一行一行,块级元素从上至下、 行内元素在每行中按从左至右的挨次排放元素,即为文档流。

2.Float:浮动流

　　浮动流：元素的浮动，即可以让一个元素脱离原来的文档流，漂到另一个地方，漂到左边或右边等等。

3.Absolute position：绝对定位

　　绝对定位：就是直接将元素的位置写清楚，距离它的外层元素的左边、右边等多少距离。

第一部分、普通流Normal Flow演示：

代码：

CSS_Position.html

.div1{
width: 200px;
height: 200px;
background-color: green;
}

.div2{
width: 200px;
height: 200px;
background-color: red;
}

.div3{
width: 200px;
height: 200px;
background-color: blue;
position: relative;
}

.mylabel{
width: 40px;
height: 40px;
background-color: yellow;
position: absolute;
top: -10px;
right: 10px;
}

View Code
效果图：