css - 如何在第二行中选择 HTML 表格的第 2 列到第 5 列？

Question

我知道

tr:nth-child(2) > td:nth-child(2)

用于选择第二行的第二列。

1. 如何在第 2 行的第 2 列和第 5 列之间进行选择？

2. 如何选择第2行第2列开始的所有列？

Answer 1

<强>1。如何在第 2 行的第 2 列和第 5 列之间进行选择？

tr:nth-child(2) > td:nth-child(n+2):nth-child(-n+5) {
  color: red;
}

<table>
    <tr><td>1</td><td>2</td><td>3</td><td>4</td><td>5</td><td>6</td><td>7</td><td>8</td></tr>
    <tr><td>1</td><td>2</td><td>3</td><td>4</td><td>5</td><td>6</td><td>7</td><td>8</td></tr>
    <tr><td>1</td><td>2</td><td>3</td><td>4</td><td>5</td><td>6</td><td>7</td><td>8</td></tr>
    <tr><td>1</td><td>2</td><td>3</td><td>4</td><td>5</td><td>6</td><td>7</td><td>8</td></tr>
    <tr><td>1</td><td>2</td><td>3</td><td>4</td><td>5</td><td>6</td><td>7</td><td>8</td></tr>
</table>

<强>2。如何选择第2行第2列开始的所有列？

tr:nth-child(2) > td:nth-child(n+2) {
  color: red;
}

<table>
    <tr><td>1</td><td>2</td><td>3</td><td>4</td><td>5</td><td>6</td><td>7</td><td>8</td></tr>
    <tr><td>1</td><td>2</td><td>3</td><td>4</td><td>5</td><td>6</td><td>7</td><td>8</td></tr>
    <tr><td>1</td><td>2</td><td>3</td><td>4</td><td>5</td><td>6</td><td>7</td><td>8</td></tr>
    <tr><td>1</td><td>2</td><td>3</td><td>4</td><td>5</td><td>6</td><td>7</td><td>8</td></tr>
    <tr><td>1</td><td>2</td><td>3</td><td>4</td><td>5</td><td>6</td><td>7</td><td>8</td></tr>
</table>