`display: initial` 对 table 行的记录效果是什么？

Question

为什么 tr { display:initial } 导致 td colspan=5 被忽略？

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8" />
    <title>Test</title>
    <style>
        * { border-style: solid; }
    </style>
</head>
<body>
    <table>
        <tr> <td>×</td> <td>×</td> <td>×</td> <td>×</td> <td>×</td> </tr>
        <tr> <td colspan="5">cs=5</td> </tr>
        <tr> <td>×</td> <td>×</td> <td>×</td> <td>×</td> <td>×</td> </tr>
        <tr style="display: initial"> <td colspan="5">cs=5,d=i</td> </tr>
        <tr> <td>×</td> <td>×</td> <td>×</td> <td>×</td> <td>×</td> </tr>
    </table>
</body>
</html>

“继承”也有同样的错误效果。

实际情况是试图使用JavaScript在“none”和“initial”之间切换显示。

Answer 1

您的解决方案是在 none 和 table-row 之间切换。

但是问得好！我无法解释为什么 initial 没有按预期工作。

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8" />
    <title>Test</title>
    <style>
        * { border-style: solid; }
    </style>
</head>
<body>
    <table>
        <tr> <td>×</td> <td>×</td> <td>×</td> <td>×</td> <td>×</td> </tr>
        <tr> <td colspan="5">cs=5</td> </tr>
        <tr> <td>×</td> <td>×</td> <td>×</td> <td>×</td> <td>×</td> </tr>
        <tr style="display: table-row"> <td colspan="5">cs=5,d=i</td> </tr>
        <tr> <td>×</td> <td>×</td> <td>×</td> <td>×</td> <td>×</td> </tr>
    </table>
</body>
</html>

`display: initial` 对 table 行的记录效果是什么？

What is the documented effect of `display: initial` on table rows?

html

css

display