关于CSS 定位及z-index、overflow、vertical-align和cursor相关属性的使用

1、css定位：
CSS 有三种基本的定位机制：普通流、float浮动和position定位。

类型	内容
普通流	只要不设置定位方式都默认为普通流。
float浮动	设置float属性
position定位	设置position属性

接下来重点说说position定位，这是在页面设计中用得比较多的定位方式。
position定位：有四种不同的定位方法。

值	属性
Static	html元素默认值。即没有定位，元素出现在正常的流中。
relative	相对定位。设置top、left等属性来进行偏移，偏移位置相对其原本位置。 注：原本的位置被保留。
absolute	绝对定位。绝对定位的元素的位置相对于最近的已定位父元素，如果元素没有已定位的父元素，那么它的位置相对于根元素。注：元素从文档流完全删除，不占据位置。
fixed	类似于absolute属性，但是其是相对于浏览器而言的定位。注：相对于浏览器窗口是固定位置，窗口是滚动的它也不会移动。

使用position定位中需要注意子绝父相。
子绝父相：子绝父相就是指子元素设置绝对定位，而父元素设置相对定位，然后设置子元素的top、left、right、bottom的值，我们就可以让子元素到达相应的位置。

2、z-index：
z-index设置元素的堆叠顺序。当元素的定位与文档流无关，所以它们可以覆盖页面上的其它元素。z-index属性指定了一个元素的堆叠顺序（哪个元素应该放在前面，或后面）。z-index的值越大，则越靠前显示，值越小就越靠后显示，可为负值。

3、overflow：

值	属性
visible	默认值。内容不会被修剪，会溢出。
hidden	内容修剪，溢出的部分
scroll	内容修剪，但显示滚动条以便查看其余的内容。
auto	如果内容溢出，则显示滚动条以便查看其余的内容。
inherit	继承，从从父元素继承 overflow 属性的值。

4、vertical-align：
vertical-align定义元素垂直位置。

5、cursor：
cursor光标样式。