

新闻资讯
技术学院最直接有效的方式是用 tr:first-child,但需确保HTML结构规范;更稳妥的是将表头放入并样式化thead tr;显式添加.header-row类最灵活可靠;表头单元格应优先使用以提升语义与可访问性。
表格首行单独设置样式,最直接有效的方式就是用 tr:first-child 选择器,但要注意它是否真的选中了你想要的“表头行”——这取决
于你的 HTML 结构是否规范。
如果表格结构清晰,把标题行放在 当表格没有 不依赖结构顺序,给表头行加一个明确的类名(如 即使不用 中,再对 thead tr 设置样式,语义正确、兼容性好、不易误伤:
table thead tr {
background-color: #f0f8ff;
font-weight: bold;
}
tr:first-child 在简单表格中可用但有陷阱
,只有纯 时, tr:first-child 确实能选中第一行。但需注意:
style="display:none" 的 ),它仍会被算作第一个子元素,导致样式错位
:first-child 不会自动重新匹配逻辑上的“标题行”用 class 显式标记表头行最灵活可靠
class="header-row"),CSS 写法直观、易维护、无歧义:
.header-row {
background: #e6f7ff;
color: #1890ff;
}姓名
年龄
补充:th 默认比 td 更适合做表头
,也建议表头单元格用 而非 。它自带加粗、居中等默认样式,语义清晰,还支持屏幕阅读器识别:
th 默认 font-weight: bold 和 text-align: center
th:first-child 或 th:last-child 做列级微调scope 属性结合,提升可访问性