【HTML】表の作り方を教えてください【CSS】

Question

１）表が作りたい
２）右下（ココと矢印で指した場所）のような表の中に横線を入れてその中にも文字を記載したい
３）現在のHTMLサンプル

<table> <thead> <tr> <th scope="col">メニュー内容</th> <th scope="col">価格</th> </tr> </thead> <tbody> <tr> <td class="txt" data-label="内容"><font color="#f2af67"><strong>文字</strong></font> 文字</td> <td class="price" data-label="価格">文字</td> </tr> </tbody> </table>

になっております。
これよりも効率の良い表の作り方などありましたら教えていただきたいです。
よろしくお願いいたします。

Answer 1

別解として、「右下のセル」の<td>...</td>の中にtableを入れ子にして書くという手も考えられそうです。

Answer 2

tableで作成されるならrowspanを利用すると出来ると思います。
HTML5のtd要素のrowspan属性の解説

この認識で合ってますか？

Comments

[mutsuki22]

ぱっと見分からないですが、低評価が付いたって事は何か勘違いしてそうですね。
申し訳ないです・・・

Answer 3

普通にやればこんな感じです

Comments

[yambejp]

<table border>
<thead>
<tr>
<th>a</th>
<th>b</th>
<th>c</th>
<th>d</th>
</tr>
</thead>
<tbody>
<tr>
<td>&nbsp</td>
<td>&nbsp</td>
<td>&nbsp</td>
<td>&nbsp</td>
</tr>
<tr>
<td>&nbsp</td>
<td>&nbsp</td>
<td>&nbsp</td>
<td>&nbsp</td>
</tr>
<tr>
<td>&nbsp</td>
<td>&nbsp</td>
<td>&nbsp</td>
<td>&nbsp</td>
</tr>
<tr>
<td rowspan="4">&nbsp</td>
<td rowspan="4">&nbsp</td>
<td rowspan="4">&nbsp</td>
<td>&nbsp</td>
</tr>
<tr>
<td>&nbsp</td>
</tr>
<tr>
<td>&nbsp</td>
</tr>
<tr>
<td>&nbsp</td>
</tr>
</tbody>
</table>