position定位问题及元素的对齐方式

定位问题

相对定位

属性值为relative;
其子元素可用left,right,top,bottom等属性来调节位置，即使发生了偏移，仍然占据着它未发生偏移的空间

绝对定位

属性值为absolute;
子元素也可以用left,right,top,bottom等属性来调节，其位置相对于其父元素的位置而言，不占据文档流的位置。
可用z-index来改变堆叠顺序：值较大的元素将叠加在z-index值较小的元素上（只对定位的元素有效）；若数值相同，就按顺序，后面的覆盖前面的

固定定位

属性值为fixed;其位置不会随浏览器窗口的滚动条而滚动。

对齐方式

1. 水平居中：行内元素text-align:center;块元素:块状元素定宽margin:0 auto;不定宽：text-align:center;

2. 垂直居中：需设定条件：父元素是盒子容器；高度已定
   （1）子元素是行内元素，父元素设置line-height
   （2）子元素是块级元素:高度未定，父元素设定display:table-cell;vertical-align:middle;高度已定：子元素设定margin-top或margin-bottom

3. 水平垂直居中
   （1）单行文本：使用text-align和line-height
   （2）方法一：父元素设置：text-align和vertical-align,display:table-cell;子元素设置display:inline-block;
   方法二：子元素是图片，父元素不用设置display，需设置line-height且font-size值为0，子元素设置vertical-align。