📌  相关文章
📜  HTML DOM TableData vAlign 属性(1)

📅  最后修改于: 2023-12-03 15:15:33.717000             🧑  作者: Mango

HTML DOM TableData vAlign 属性

HTML DOM TableData vAlign 属性定义单元格内容的垂直对齐方式。

语法
document.getElementById("myTd").vAlign=value
属性值

下面是 vAlign 属性可能的属性值：

  • "top"：单元格内容垂直对齐方式置于单元格顶部。
  • "middle"：单元格内容垂直对齐方式置于单元格中心。
  • "bottom"：单元格内容垂直对齐方式置于单元格底部。
  • "baseline"：默认值。单元格内容与基线对齐。
  • "text-top"：单元格内容垂直对齐方式置于单元格顶部距离最高的内容的上沿。
  • "text-bottom"：单元格内容垂直对齐方式置于单元格底部距离最低的内容的下沿。
实例
<!DOCTYPE html>
<html>
<body>

<table style="width:100%">
  <tr>
    <th>Month</th>
    <th>Savings</th>
  </tr>
  <tr>
    <td valign="top">January</td>
    <td>$100</td>
  </tr>
  <tr>
    <td valign="middle">February</td>
    <td>$50</td>
  </tr>
  <tr>
    <td valign="baseline">March</td>
    <td>$300</td>
  </tr>
</table>

</body>
</html>
返回

以上代码会把表格的第一列分别设置为不同的垂直对齐方式。当你指向各个值时，你会看到该值的具体效果。

# HTML DOM TableData vAlign 属性

HTML DOM TableData vAlign 属性定义单元格内容的垂直对齐方式。

## 语法

```javascript
document.getElementById("myTd").vAlign=value
属性值

下面是 vAlign 属性可能的属性值：

  • "top"：单元格内容垂直对齐方式置于单元格顶部。
  • "middle"：单元格内容垂直对齐方式置于单元格中心。
  • "bottom"：单元格内容垂直对齐方式置于单元格底部。
  • "baseline"：默认值。单元格内容与基线对齐。
  • "text-top"：单元格内容垂直对齐方式置于单元格顶部距离最高的内容的上沿。
  • "text-bottom"：单元格内容垂直对齐方式置于单元格底部距离最低的内容的下沿。
实例
<!DOCTYPE html>
<html>
<body>

<table style="width:100%">
  <tr>
    <th>Month</th>
    <th>Savings</th>
  </tr>
  <tr>
    <td valign="top">January</td>
    <td>$100</td>
  </tr>
  <tr>
    <td valign="middle">February</td>
    <td>$50</td>
  </tr>
  <tr>
    <td valign="baseline">March</td>
    <td>$300</td>
  </tr>
</table>

</body>
</html>
返回

以上代码会把表格的第一列分别设置为不同的垂直对齐方式。当你指向各个值时，你会看到该值的具体效果。