Html 如何选择所有第一个td'；他在桌子上

您好，如果您有一个简单的html，如：

<table>
  <tr><td>label</td> <td>value</td></tr>
  <tr><td>label</td> <td>value</td></tr>
  <tr><td>label</td> <td>value</td></tr>
</table>

但是该选择器只会选择第一个

tr

的第一个

td

，不会选择所有

td的

，所以我尝试了

table.widget tr td:first-child{
    max-width:10%;
}

当然，我得到的是

TD

的第一个孩子的选择。而不是

td

本身

实现这一点是可能的？

一种方法：

table tr td:first-of-type {
background: lemonchiffon;
}

单向：

table tr td:first-of-type {
background: lemonchiffon;
}

试试这个：

table tr td:first-child { color: red; }

小提琴：试试这个：

table tr td:first-child { color: red; }

---

小提琴：

您的第二个选择器实际上是正确的：

要选择每个td的第一个子项，选择器如下所示：

table.widget tr td :first-child { /* note the space after the td */
    // styles
}

但是，应该注意，OP的示例表没有应用

小部件
类

如果表表示键/值对的集合，则将标签文本放置在
th
中可能更合适：


table.th{
背景：橙色；
}
标签值
标签值
标签值
您的第二个选择器实际上是正确的：


要选择每个td的第一个子项，选择器如下所示：

table.widget tr td :first-child { /* note the space after the td */
    // styles
}

但是，应该注意，OP的示例表没有应用
小部件
类

如果表表示键/值对的集合，则将标签文本放置在
th
中可能更合适：


table.th{
背景：橙色；
}
标签值
标签值
标签值
他想要每行的所有第一个
，而不仅仅是第一个
他想要每行的所有第一个
，而不仅仅是第一个
ohhh在td之前不知道th。。很好的建议，谢谢现在正在工作…没有空格的选择器和td后面的whit空格有什么区别？
E:first child
只是
：first child
的一个更具体的版本。两个元素都必须是第一个子元素，但是
E:first child
指定它必须是E的特定元素。因此
td:first child
表示获取作为其父元素的第一个元素的td，而
td:first child
表示获取td中的第一个元素，不管是什么样的。哦，在td之前，他不知道th。。很好的建议，谢谢现在正在工作…没有空格的选择器和td后面的whit空格有什么区别？
E:first child
只是
：first child
的一个更具体的版本。这两个元素都必须是第一个子元素，但是
E:first child
指定它必须是E的特定元素。因此
td:first child
表示获取作为其父元素的第一个元素的td，而
td:first child
表示获取td中的第一个元素，无论它是什么类型。