設置 tr 的 100% 寬度

Question

我有下表：

我希望從第二列開始的行填充以下列。 換句話說，年列要填滿表格的 25%（與 "Anio" 相同），而年行內的其他兩行必須填滿表格的 75%（第二、第三和第四列） （每個 25%）），而“OSDE”中的其他兩個必須填充表的 50%（第三和第四列）。

我有這個（我正在用js構建它）：

 <table width="100%"> <tr> <th width="25%">Anio</th> <th width="25%">Obra social</th> <th width="25%">Doctor</th> <th width="25%">Valor</th> </tr> <tr> <td width="25%" rowspan="2">2018</td> <tr> <td width="25%" rowspan="2">OSDE</td> <td>medico1</td> <td>1</td> </tr> <tr> <td>medico2</td> <td>2</td> </tr> </tr> <tr> <tr> <td width="25%" rowspan="2">UP</td> <td>medico1</td> <td>1</td> </tr> <tr> <td>medico2</td> <td>2</td> </tr> </tr> <tr> <td width="25%" rowspan="2">2019</td> <tr> <td width="25%" rowspan="2">OSDE</td> <td>medico1</td> <td>1</td> </tr> <tr> <td>medico2</td> <td>2</td> </tr> </tr> <tr> <tr> <td width="25%" rowspan="2">UP</td> <td>medico1</td> <td>1</td> </tr> <tr> <td>medico2</td> <td>2</td> </tr> </tr> </table>

Answer 1

代碼中的兩個主要問題：

1.) 包含年份的單元格需要rowspan="4" （它們 go 跨越 4 行）

2.)不得將tr嵌套在tr中（只能嵌套由table 、 tr s 和td s 組成的完整表，並且只能嵌套在td s 中）。 請注意創建完整的行，其中td的數量在所有行中都相同，還要考慮前行中所有單元格的行rowspan設置。

 table { border-collapse: collapse; } td, th { border: 1px solid #ccc; }

 <table width="100%"> <tr> <th width="25%">Anio</th> <th width="25%">Obra social</th> <th width="25%">Doctor</th> <th width="25%">Valor</th> </tr> <tr> <td width="25%" rowspan="4">2018</td> <td width="25%" rowspan="2">OSDE</td> <td>medico1</td> <td>1</td> </tr> <tr> <td>medico2</td> <td>2</td> </tr> <tr> <td width="25%" rowspan="2">UP</td> <td>medico1</td> <td>1</td> </tr> <tr> <td>medico2</td> <td>2</td> </tr> <tr> <td width="25%" rowspan="4">2019</td> <td width="25%" rowspan="2">OSDE</td> <td>medico1</td> <td>1</td> </tr> <tr> <td>medico2</td> <td>2</td> </tr> <tr> <td width="25%" rowspan="2">UP</td> <td>medico1</td> <td>1</td> </tr> <tr> <td>medico2</td> <td>2</td> </tr> </table>