![CSS 点击按钮以后修改DIV的高度，代码怎么写？[有代码]](/aiimages/CSS+%E7%82%B9%E5%87%BB%E6%8C%89%E9%92%AE%E4%BB%A5%E5%90%8E%E4%BF%AE%E6%94%B9DIV%E7%9A%84%E9%AB%98%E5%BA%A6%EF%BC%8C%E4%BB%A3%E7%A0%81%E6%80%8E%E4%B9%88%E5%86%99%EF%BC%9F%5B%E6%9C%89%E4%BB%A3%E7%A0%81%5D.png)
html垂直居中有4中方法。
分别有：使用line-height；使用表格；利用display:table-cell；使用绝对定位。
具体实现方法：
使用line-height
把文字的line-height设为文字父容器的高度，适用于只有一行文字的情况。可以让文字在父元素内垂直居中。
使用表格
在IE6、7中我们可以使用vertival-align:middle来对表格里的元素进行垂直居中.
利用display:table-cell
对于那些不是表格的元素，我们可以通过display:table-cell 来把它模拟成一个表格单元格，这样就可以利用表格实现垂直居中了。
使用绝对定位实现
绝对定位进行居中的原理是通过把这个绝对定位元素的left或top的属性设为50%,这个时候元素并不是居中的，而是比居中的位置向右或向左偏了这个元素宽度或高度的一半的距离，所以需要使用一个负的margin-left或margin-top的值来把它拉回到居中的位置，这个负的margin值就取元素宽度或高度的一半。
注意：此法只适用于那些我们已经知道它们的宽度或高度的元素。否则margin负值的调整无法精确。
文字垂直居中：
设置标签高度height，并且设置行高line-height值与height值一样。
也可以给父标签设置相对定位（position：relative），然后文字用一个行内标签（如span）包裹，并且给span设置绝对定位。
div垂直居中：
可以使用margin或padding来控制。比如margin：70% 0；（上下70%，左右0）
如果满意，望采纳，谢谢！如果不懂，可随时追问！
单行文字（即文字较少，不够一行）重直居中比较好解决，使用行高和高度相等即可。如：.abc{height:100pxline-height:100px}多行文本垂直居中分两种情况
1、div高度不固定，使用padding属性，将上下空相等的间距即可，如：.abc{height:autopadding:20px 10px/*上下各空20px,左右空10px*/}
2、div固定高度文字重直居中（这种情况比较常见，稍微复杂些），思路，将div转化表格属性，因为表格是可以实现垂直居中的。需要多添加一个div层,具体如下：
样式代码：
.waiceng{
height:400px
display:table
}
.liceng{
vertical-align:middle
display:table-cell
border:1px solid #FF0099
background-color:#FFCCFF
width:760px
}
源代码：
<div class="waiceng">
<div class="liceng">现在我们要使这段文字垂直居中显示</div>
</div>
声明：上面的代码IE6不支持。不过现在没几个人用IE6了，可以忽略了
