<html>
<HEAD>
<META http-equiv="content-type" content="text/htmlcharset=UTF-8" />
</HEAD>
<table width="200px" height="500px" border="1">
<tr>
<td>
<div style="width:200pxheight:200pxborder:red 1px solid">这里高度随字数改变而改变</div>
</td>
<td>
<div style="width:200pxheight:100pxborder:blue 1px solid">我要整个蓝色DIV不管怎要样都在这个TD顶部对齐</div>
</td>
</tr>
</table>
</html>
在这个DIV的父级td 加 vertical-align:top已测试
<html>
<HEAD>
<META http-equiv="content-type" content="text/htmlcharset=UTF-8" />
</HEAD>
<table width="200px" height="500px" border="1">
<tr>
<td>
<div style="width:200pxheight:200pxborder:red 1px solid">这里高度随字数改变而改变</div>
</td>
<td style="vertical-align:top">
<div style="width:200pxheight:100pxborder:blue 1px solid">我要整个蓝色DIV不管怎要样都在这个TD顶部对齐</div>
</td>
</tr>
</table>
</html>
表格中数据的排列方式有两种：左右排列（水平对齐），上下排列（垂直对齐）。
左右排列是以ALIGN属性来设置；
上下排列则由VALIGN属性来设置。
其中左右排列的位置可分为三种：
居左（left)、居右(right)和居中(center)；
#=left, center, right
左右排列（水平对齐）代码示例：
<TABLE WIDTH="100" BORDER="1" HEIGHT="60">
<TR><TD align=center>内容居中对齐</TD></TR>
<TR><TD style="text-align:center">内容居中对齐：css语法</TD></TR>
</TABLE>
上下排列基本上比较常用的有四种：
上齐(top)、居中(middle)、下齐(bottom)和基线(baseline)
#=top，middle，bottom，baseline
上下排列（垂直对齐）代码示例：
<TABLE WIDTH="100" BORDER="1" HEIGHT="60">
<TR><TD VALIGN=TOP>内容顶部对齐</TD></TR> <TR><TD style="vertical-align:top">内容顶部对齐：css语法</TD></TR> </TABLE>
