CSS表格中的第二个td - CSS

表格是Web页面中常用的一种元素。在表格中，我们通常需要对某个单元格进行样式设置，比如改变其字体颜色、背景色等。本文将介绍如何在CSS中选取表格中的第二个td元素，并对其进行样式设置。

选取表格中的第二个td元素

在CSS中，我们可以通过伪类选择器nth-child()来选取表格中的第二个td元素。语法格式如下：

td:nth-child(2) {
  /* 样式设置 */
}

其中，td表示表格单元格，:nth-child(2)表示选取第二个td元素。

设置样式

在选取第二个td元素后，我们可以对其进行样式设置。以下是几个常见样式设置的例子：

改变字体颜色

td:nth-child(2) {
  color: red;
}

改变背景色

td:nth-child(2) {
  background-color: yellow;
}

改变字体样式

td:nth-child(2) {
  font-weight: bold;
  font-style: italic;
}

示例

以下是一个示例表格及对其中第二个td元素进行样式设置的代码：

<table>
  <tr>
    <td>姓名</td>
    <td>年龄</td>
    <td>性别</td>
  </tr>
  <tr>
    <td>张三</td>
    <td>18</td>
    <td>男</td>
  </tr>
  <tr>
    <td>李四</td>
    <td>20</td>
    <td>女</td>
  </tr>
  <tr>
    <td>王五</td>
    <td>22</td>
    <td>男</td>
  </tr>
</table>

td:nth-child(2) {
  color: red;
  font-weight: bold;
}

效果如下：

以上就是CSS表格中选取第二个td元素并进行样式设置的介绍。