📜  HTML |行属性(1)

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

HTML 行属性

在 HTML 中,可以使用行属性来指定表格中每行的不同属性。这些属性主要包括:

  • <tr>bgcolor 属性:定义表格行的背景色。
  • <tr>height 属性:定义表格行的高度。
  • <tr>align 属性:定义表格行中内容的水平对齐方式。
  • <tr>valign 属性:定义表格行中内容的垂直对齐方式。
  • <td><th>bgcolor 属性:定义该单元格的背景色。
bgcolor 属性

使用 bgcolor 属性可以为表格行指定背景色,可以以颜色名或颜色值(如 #RRGGBB)指定。例如:

<tr bgcolor="lightgray">
  <td>John</td>
  <td>Doe</td>
  <td>john@example.com</td>
</tr>

效果如下:

John Doe john@example.com
height 属性

使用 height 属性可以为表格行指定高度,可以以像素或百分比形式指定。例如:

<table>
  <tr height="50px">
    <td>Row with fixed height</td>
  </tr>
  <tr height="20%">
    <td>Row with percentage height</td>
  </tr>
</table>

效果如下:

Row with fixed height
Row with percentage height
align 属性

使用 align 属性可以为表格行中的内容指定水平对齐方式,可选值有 leftcenterright。例如:

<tr align="center">
  <td>John</td>
  <td>Doe</td>
  <td>john@example.com</td>
</tr>

效果如下:

John Doe john@example.com
valign 属性

使用 valign 属性可以为表格行中的内容指定垂直对齐方式,可选值有 topmiddlebottom。例如:

<tr valign="middle">
  <td>John</td>
  <td>Doe</td>
  <td>john@example.com</td>
</tr>

效果如下:

John Doe john@example.com
单元格 bgcolor 属性

除了可以为整个表格行指定背景色以外,你还可以为每个表格单元格(即 <td><th>)指定背景色。例如:

<table>
  <tr>
    <th bgcolor="lightblue">Name</th>
    <th bgcolor="lightgreen">Age</th>
  </tr>
  <tr>
    <td bgcolor="linen">John</td>
    <td bgcolor="lightyellow">25</td>
  </tr>
  <tr>
    <td bgcolor="linen">Bob</td>
    <td bgcolor="lightyellow">30</td>
  </tr>
</table>

效果如下:

Name Age
John 25
Bob 30

以上就是 HTML 行属性的简要介绍,使用这些属性可以使表格更加具有可读性和美观性。