水平居中，垂直居中

不定宽度的块级元素水平居中

1，用table

 

<table><tr><td><div>居中</div></td></tr></table>

Table不设置宽度的话，他的宽度由内部元素宽度决定，所以设置table的 margin：0 auto可实现居中；缺点，增加了嵌套，标签无语义。

2，强制以display：inline；text-align：center

缺点，会带来一些限制，减少了块级元素的功能，如宽高无效了。

 

3，父元素设置float，position：relative；left：50%；子元素设置position：relative；left：-50%；

 

 

 

父元素确定的多行文本，图片，块级元素竖直居中（子元素高度不定）。

1，css有vertical-align，但只有父元素为td，th时才生效。其它块级如div，p等不生效。在IE 8及其以上浏览器可以设置display：table-cell。这种方法无法跨浏览器。所以直接用table来布局可兼容。缺点就易见了。Table布局时，td默认隐式设置了vertial-align为middle，不需要显式设置了。

2，用Hacker将先display：table-cell，然后给父子元素设置*top：50%；*top：-50%兼容IE6，7。

3，图片的话可以设置background-position：center，center；但是这样的话图片最好放背景图片，内容图片这样展示的话，seo会有影响，因为搜索引擎不会去抓你的background吧。