css内容垂直居中

    <div class="gg">       <img src="delete.png">    </div>

 在img外面嵌套一个div容器，解决方法如下：

1 display:table-cell;vertical-align:middle; 图片居中

2 line-heihgt和height保持一致 ，单行文本、图片居中

3 给容器设置绝对定位（position:absolute）,并且定位高度（top:50%）和margin-top为高度的一半（margin-top:-height/2）（多行元素的垂直居中）

<div class="vertical">content</div>

.vertical {height: 100px;/*元素的高度*/<span style="white-space:pre"></span>position: absolute;top: 50%;/*元素的顶部边界离父元素的的位置是父元素高度的一半*/margin-top: -50px;/*设置元素顶边负边距，大小为元素高度的一半*/}

由于固定死元素的高度，致使没有足哆的空间，当内容超过容器的大小时，要么会消息，要么会出现滚动条

4 绝对定位之后，div水平居中，

 

div{position:fixed;top:0;left:0;right:0;margin:auto;z-index:999}

4 固定高度，多行文字垂直居中

<p class="mulit_line" style="background:red;">    <span style="font-size:12px;">这里是高度为150像素的标签内的多行文字，文字大小为12像素。<br />这里是第二行，用来测试多行的显示效果。</span><i> </i></p>

 .mulit_line{line-height:100px;}.mulit_line span{ display:inline-block;line-height:15px; vertical-align:middle;}.mulit_line i{width:0; display:-moz-inline-stack; display:inline-block; vertical-align:middle; font-size:0;}