div，p，hr，都是块元素，独占一行，span，i，img，都是行内元素，两个行内元素相邻，就会位于同一行，并且从左到右排列。

正常文档流：从上往下，从左到右，按顺序排列。

脱离文档流：脱离正常排序。

浮动标签：

<float: 取值>，取值：left或right.

浮动会影响元素的布局，所以，在设置完浮动后，如果发现有不对劲的地方，我们需要清除浮动，

清除浮动标签：

<clear:取值>，取值: left或right, both。通常我们取both,同时清除左右浮动。

凡云阁在实际开发中，一般都是在浮动元素后面再增加一个空元素，然后为这个空元素定义"clear:both"，来清除浮动。

定位布局：

{

position:fixed; /*设置元素为固定定位*/

top:30px;

left:160px;

width:60px;

height:60px;

border:1px solid silver;

background-color:hotpink;

}

注意这里的定位要相对于浏览器来说的。

相对定位：position:relative.(相对正常文档流的位置)

绝对定位：position:absolute，（完全脱离文档流，前面与后面元素会认为此元素不存在）。

静态定位：position:stailc. 元素没有指定position属性时，就是静态定位，如果想要元素从其他定位变成静态定位，就需要使用这个标签来实现。

本文固定链接: http://www.fanyun.ltd/2054.html | 凡云阁