修复了 TR/table 在 DOCTYPE XHTML 上的显示

Question

显示相同的代码不同 通过 XHTML () 和 HTML5 ()

<table border="1">
<tr><th>COL1</th><th>COL2</th><th>COL3</th></tr>
<tr><form action="">
<td>111</td><td><input type="text" name="correo" /></td><td>333</td>
</form></tr>
and other TR with other form ...
and other TR with other form ...
and other TR with other form ...
...
</table>

...我需要用 XHTML 显示这个，但是所有的失真...

使用 HTML：

使用 xHTML：

我该如何解决这个问题？

Answer 1

样式可以通过使用 HTML5 的 XML 语法（又名 XHTML）来实现

<style>
    tr form { display: contents; }
    td { border: 1px inset black; }
</style>

但不要。您的标记在 HTML 语法或 XML 语法中都不是有效的 HTML5。

您应该使用控件上的form 属性来关联 使用表单进行控制，如下所示：

<form action="" id="myform1"></form>
<table border="1">
  <tr><th>COL1</th><th>COL2</th><th>COL3</th></tr>
  <tr>
    <td>111</td>
    <td><input type="text" name="correo" form="myform1" /></td>
    <td>333</td>
  </tr>
</table>