水平居中
- 文本、图片等行内元素的水平居中
给父元素设置text-align:center可以实现文本、图片等行内元素的水平居中
- 确定宽度的块级元素的水平居中
通过设置margin-left:auto;和margin-right:auto来实现
- 不确定宽度的块级元素的水平居中（以分页模块为例，ul li实现分页）
- 使用table
分页的数量不确定，所以不能通过设置宽度来限制，这样的话方法2就无法使用了，但可以通过table标签，table本身 并不是块级元素，它的宽度随内部元素的宽度“撑起”,但即使不设定它的宽度，仅设置margin-left:auto;margin-right :auto就可以实现水平居中，将ul包含在table内，对table设置margin-left:auto;margin-right:auto，就实现了水平居中
- 块级元素变行内元素，在使用text-align:center
将li的display:inline，ul设置text-align:center实现居中。将块级元素改为行内元素，丢失了一些块级元素的功能
- 使用position:relative,激活left
通过父元素设置position:relative和left:50%，子元素设置position:relative和left:-50%.这样保留了display:block的功能，但却设置了position:relative，带来了一些副作用
垂直居中
- 父元素高度不确定的文本、图片、块级元素的垂直居中
通过给父容器设置相同的上下内边距实现。
- 父元素确定的单行文本垂直居中
通过给父元素设置line-height来实现，line-height值与父元素高度相同
- 父元素高度确定的多行文本、图片、块级元素垂直居中
- vertical-align属性
对于table中的td th可以使用vertical-align（td标签默认为vertical-align:middle）,对于其他块级元素都不支持。
- display:table-cell属性
在ie8和Firefox可以通过设置display:table-cell，激活vertical-align属性（ie6 7不支持display:table-cell） 如果是ie6 ie7通过给父子两层元素分别设置top:50%和top:-50%;来实现居中。
hello world
hello world
hello world