1.照片墙案例（相对定位）：以元素自己为目标设置偏移
通常偏移量是很小的,而且元素不离队(流)
position:relative;
效果：
2.绝对定位：以元素的带有position的父辈为目标设置偏移
若父辈上都有position,则以就近的父辈为目标
若父辈上都没有position,则以就远的父辈为目标(body)
元素会离队(流)
position:absolute;
你想以谁为目标,就在谁上面加position
效果：
3.固定定位：以浏览器窗口为目标设置偏移
元素会离队(流)
position:fixed;
元素会挂在窗口上保持不动
中间略
后加<div><a href="#">顶部</a></div>
效果：
定位使用建议（它们在偏移时所参考的目标不同）：
固定定位:看元素是否要挂在窗口上保持不动.
相对定位:看元素偏移量是否很小,它的位置是否释放.
浮动定位:是否要将块元素左右排列.
绝对定位:一般超过10秒没想出来,就是绝对定位.
4.堆叠顺序：实现鼠标指向图片将不被遮盖
效果：
5.列表样式：
效果：
6.元素的显示方式：可以改变为行内元素、块元素，或隐藏
1）块
有宽高,垂直排列
h,p,ol,ul,div,table,form
2）行内
无宽高,左右排列
span,i,em,b,strong,u,del,a,label
3）行内块
有宽高,左右排列
img,input,select,textarea
4）如何修改元素的显示方式?
块: display:block;
行内: display:inline;
行内块: display:inline-block;
隐藏: display:none;
效果：
最后完善一下之前的网页案例：
html中增加的代码
logo图片和菜单区图片
消息提示框
css增加代码：
效果：
