HTML 表格行高設置後，內部列表頂部對齊的解決方案

問題現象

當 `` 設置固定高度時，單元格內的列表（`

`/`
`）默認垂直居中顯示，導致內容不在頂部起始位置，影響視覺效果。

核心解決方案

在 `` 標籤上添加 valign="top" 屬性，強制單元格內容頂部對齊：

<tr style="height: 100px;">
  <td valign="top">
    <ul>
      <li>項目 1</li>
      <li>項目 2</li>
      <li>項目 3</li>
    </ul>
  </td>
</tr>

現代 CSS 替代方案

推薦使用 CSS 替代已棄用的 valign 屬性：

<style>
  .top-aligned { vertical-align: top; }
</style>

<td class="top-aligned">...</td>

或針對整行：

<tr style="vertical-align: top;"> ... </tr>

完整示例

<table border="1">
  <tr style="height: 150px; vertical-align: top;">
    <td>
      <ul>
        <li>第一項內容</li>
        <li>第二項內容</li>
        <li>第三項內容</li>
      </ul>
    </td>
    <td>右側單元格同樣頂部對齊</td>
  </tr>
</table>

注意事項

• valign 在 HTML5 中已棄用，現代項目請使用 CSS vertical-align
• vertical-align 僅對表格單元格、inline/inline-block 元素生效
• 若單元格包含塊級元素，需確保父容器無衝突的 display 設置