HTML垂直对齐

HTML垂直对齐,html,html-table,alignment,Html,Html Table,Alignment,我有一个表对齐我有麻烦做我想做的事。下面是我所拥有的,但我希望其中有1个单元格的单元格与整个表格的顶部相拥抱,而我希望其中有2个单元格的单元格与表格的底部基线相拥抱。单元3可能具有可变高度。有人知道这怎么可能吗?可能是我遗漏了一些简单的东西,但我还没有弄明白 <table cellpadding="0" cellspacing="0" border="0"> <tr> <td valign="top">

我有一个表对齐我有麻烦做我想做的事。下面是我所拥有的,但我希望其中有1个单元格的单元格与整个表格的顶部相拥抱,而我希望其中有2个单元格的单元格与表格的底部基线相拥抱。单元3可能具有可变高度。有人知道这怎么可能吗?可能是我遗漏了一些简单的东西,但我还没有弄明白

<table cellpadding="0" cellspacing="0" border="0">
       <tr>
       <td valign="top">
              <table cellpadding="0" cellspacing="0" border="0" width="50">
              <tr>
                     <td>1
                    </td>
                </tr>
                <tr>
                     <td>2
                    </td>
                </tr>
            </table>
        </td>
        <td height="200" width="50">3
        </td>
    </tr>
</table>

1.
2.
3.

您需要在表格中添加一个
height=“100%”
,并在单元格中添加一些
valign
属性

<table cellpadding="0" cellspacing="0" border="0" height="100%">
  <tr>
  <td>
    <table cellpadding="0" cellspacing="0" border="0" width="50" height="100%">
      <tr>
        <td valign="top">1
        </td>
      </tr>
      <tr>
        <td valign="bottom">2
        </td>
      </tr>
    </table>
  </td>
  <td>
    <table><tr><td height="200" width="50">3</td></tr></table>
  </td>
  </tr>
</table>

1.
2.
3.
啊,我明白了:

<table width="600" border="0" cellspacing="0" cellpadding="0">
  <tr>
    <td width="300" height="19">1</td>
    <td width="300" rowspan="2">
    <br>
    <br>
    3<br>
    <br>
    </td>
  </tr>
  <tr>
    <td valign="bottom">
    <table width="300" border="0" cellspacing="0" cellpadding="0">
      <tr>
        <td>2</td>
      </tr>
    </table></td>
  </tr>
</table>

1.


3

2.
我不建议使用br标记进行对齐。