CSS设置水平居中、垂直居中

水平居中：

一、内联元素：

行内元素的父元素设置 text-align:center;

二、块级元素：

1.定宽块级元素：

设置margin:auto;

2.不定宽块级元素：

⑴加入table标签： 缺点：

利用table标签长度自适应性，即根据内容长度决定，然后再设置margin值使其居中；                   //增加无意义标签 

⑵设置display:inline，使其成为行内元素，然后text-align实现居中； //改变display会缺少一些功能如设置长度

        ⑶设置浮动与相对定位

父元素float，然后设置position:relative;left:50%;  子元素设置position:relative和left:-50%;实现水平居中

垂直居中：

一、父元素高度确定的单行文本

设置height与line-height值相等 //当内容超过块的宽时，会有内容脱离块

二、父元素高度确定的多行文本

1.加入table标签：

table中的td默认了vertical-align:middle;

2.设置块级元素的display:table-cell;(设置为表格单元显示)，激活vertical-align。（chrome、firefox、ie8以上）//兼容性较差