tr标签必须嵌套在table内，仅作行容器包裹td/th，不定义数据语义；colspan/rowspan仅适用于td/th，tr自身不支持；空tr会渲染为不可见但占位的空白行；class/style可用于整行样式，但width/height等属性无效。
tr 标签必须嵌套在 table 内部，不能单独存在
tr 是表格行容器，它本身不定义结构，只负责包裹 td 或 th。浏览器会忽略脱离 table 的 tr，甚至可能将其移出 DOM。常见错误是直接写 <tr><td>data</td></tr> 而没包在 <table> 里——此时渲染完全不可预期，控制台通常不会报错，但内容可能消失或错位。
<p>正确结构只有两种合法形式：</p>
<ul>
<li><code><table><tr><td>...</td></tr></table>
<table>
<thead><tr><th>...</th></tr></thead>
<tbody><tr><td>...</td></tr></tbody>
</table>tr 的 colspan 和 rowspan 必须由 td/th 控制，tr 自身不支持
tr 标签没有 colspan 或 rowspan 属性。这两个属性只能写在 td 或 th 上，用来让单个单元格横跨多列或纵跨多行。如果误写成 <tr colspan="2">，该属性会被完全忽略，且无法实现合并效果。
<p>典型错误场景：想让标题行跨两列，却给 <code>tr 加 colspan。正确做法是：
<tr> <th colspan="2">汇总数据</th> </tr>
注意：colspan="2" 意味着这个 th 占据当前行的两个逻辑列位置，后续同层 td 数量需相应减少，否则表格列数会错乱。
空 tr 标签会导致不可见但占位的“空白行”
写一个空的 <tr></tr> 不会报错，但会在表格中插入一行高度为默认最小值（通常约 16–20px）的空白行。这不是 bug，而是规范行为：tr 作为行容器，即使无子元素也会被渲染为一行。
常见陷阱：
- 动态生成表格时，条件判断漏掉
td但保留了tr开闭标签 - 用 JS 清空某行内容后只删了
innerHTML，忘了移除整个tr - CSS 设置
display: none在tr上，但父级table仍按“有这一行”计算布局（某些旧版 IE 表现异常）
tr 的 class 和 style 可用于整行样式，但部分 CSS 属性无效
给 tr 添加 class 或内联 style 是合法且常用的做法，比如 <tr class="highlight"> 配合 CSS 设置背景色。但要注意：<code>width、height、padding、margin 这些属性在 tr 上基本无效——它们会被浏览器忽略或重置，因为表格布局由单元格和表格模型决定。
真正生效的常用样式包括：
-
background-color（整行背景） -
border-bottom（模拟行分割线，需配合border-collapse: collapse） -
opacity或visibility（控制显隐） -
vertical-align（影响单元格内文本对齐，但优先级低于td自身设置）
想精确控制某行高度？得在该行所有 td/th 上统一设 height 或 min-height，而不是写在 tr 上。
tr 不是通用容器，它的存在意义完全依附于表格上下文，任何脱离 table 结构或混淆单元格与行职责的操作，都会在视觉或可访问性层面埋下隐患。
前端入门到VUE实战笔记：立即使用
在学习笔记中，你将探索 前端 的入门与实战技巧！
