CSS文本模块垂直对齐完全解析

web前端开发课程：css文本模块-垂直对齐。

讲课人：波波老师。

垂直对齐vertical-align，这个只能用于在表格中的<td>或者<th>才可以垂直对齐其他的标签，这个垂直对齐的功能是无效的。我们来看代码。

·先来做一个<div>，VC看看能不能居中对齐，垂直居中。比如点VC把它的高度设为100px。

·来加个背景颜色，background-color，可以看到它有一个灰色的背景色，给它加个vertical-align，看看这个middle显然没有效果。

·再来做一个表格，table，一个tr，再来个td*3，分别做class="vt"，class="vc"，class="evb"。

·来做个table，做一下样式，把它的宽度设为100%，然后td，把它的边框。

·可以看到这个表格已经出来了，这个时候在VC这里做一个居中对齐，可以看到它是居中了，底部对齐，顶部对齐。

·再加两个.vt，做一个顶部对齐vertical-align：top，可以看到这个vt已经顶部对齐了。

·再来做这个.vb的底部对齐，点vb，vertical-align：bottom，这个变成底部对齐了。

演示到这里。