流体布局
块元素(block):
- 从上往下
- 块级元素各占据一行,默认宽度是它本身父容器的100%（和父元素的宽度一致），与内容无关
- 块级元素可以包含内联元素和块级元素
<div>
<form>
<h1>
<hr>
<p>
<ol><ul><li>
<tr>
等
内联元素(inline):
- 从左上到右下
- 行内元素设置width无效，height无效(可以设置line-height)，margin上下无效，padding上下无效
- 不能包含块级元素，只能包含文本或者其它内联元素
<span>
<a>
<image>
等
内联元素和块级元素转换
display:block (字面意思表现形式设为块级元素)
display:inline (字面意思表现形式设为内联元素)
可变元素素列表 (inline-block:具有 block 元素可以设置宽高的特性，同时又具有 inline 元素默认不换行的特性的元素)
<image>
<input>
<button>
<iframe>
<object>
等
float 属性(从正常流中移除，浮动元素)
尽可能远的向左或向右移动一个元素，他下面的内容会围绕这个元素流动
float:right
clear 属性(当元素流入时禁止有重叠)
clear:right
冻结(绝对)布局 (貌似用的比较多)
绝对布局的会从流中删除，在布局的时候会完全忽略，因此将可能出现遮挡～
####### 绝对定位：position 默认static，正常文档流里面。当设置为absolute 则为绝对布局
#sidebar {
position:absolute;
top:10px;
right:200px;
width:280px;
}
固定定位 （相对绝对布局区别：固定定位放置的内容会一直停在原位置，即使滚动页面也会悬浮在原位置，广告之类的视图～～）
sidebar {
position:fixed;
top:10px;
right:200px;
}
z-index
z-index 虚拟出一个z轴，z-index越大元素越靠近你，越在上层
