css垂直居中的几种方式_html/css_WEB-ITnose

　　

1. 对于可以一行处理的 设置 height:apx; line-height:apx;

2.对于一段文字(会多行显示的)
->2.1如果是可以设置一个固定高度的
父元素使用display:table; height: apx; 子元素使用 display:table-cell; vertical-align:middle;

　　　　　note: vertical-align属性只对部分html元素有效 具体是拥有valign特性的(X)HTML标签

比如 基本上 对于inline-block显示的元素(内联元素)有效

　　　　->2.2如果是一个高度不固定的
设置上下 一样的内补 padding-top:apx; padding-bottom:apx;

->2.3 使用csshack支持ie6 垂直居中 综合考虑 table-cell方案 多层嵌套
div#wrap {
display:table;
border:1px solid #FF0099;
background-color:#FFCCFF;
width:760px;
height:400px;
_position:relative;
overflow:hidden;
}

div#subwrap {
vertical-align:middle;
display:table-cell;
_position:absolute;
_top:50%;
}

div#content {
_position:relative;
_top:-50%;
}

参考:http://www.zhangxinxu.com/wordpress/2010/05/%E6%88%91%E5%AF%B9css-vertical-align%E7%9A%84%E4%B8%80%E4%BA%9B%E7%90%86%E8%A7%A3%E4%B8%8E%E8%AE%A4%E8%AF%86%EF%BC%88%E4%B8%80%EF%BC%89/