HTMLの疑問 （教えてください！）

サイトデザインをしていて、正しいHTMLの記述がわからなくなることがあります。

例えば、テーブルタグ。

①
<table>
<tr>
<th>食べ物</th>
<th>好み</th>
</tr>
<tr>
<td>りんご</td>
<td>好き</td>
</tr>
<tr>
<td>みかん</td>
<td>嫌い</td>
</tr>
</table>

②
<table>
<tr>
<th><p>食べ物</p></th>
<th><p>好み</p></th>
</tr>
<tr>
<td><p>りんご</p></td>
<td><p>好き</p></td>
</tr>
<tr>
<td><p>みかん</p></td>
<td><p>嫌い</p></td>
</tr>
</table>

<th>～</th>・<td>～</td>内は、<p>～</p> で囲むべきなのか？
テーブル①②は、どちらが正しいのでしょう？


調べてみたところ、
私と同じ疑問を持ってる方は、わりといるらしく、いくつか事例が載っていましたが、
それぞれに解釈（？）の仕方が違うようなんですよね。


以下、検索結果。

1. インライン要素はブロック要素で囲むべき。
   よって、<th><td>は、インライン要素なので<p>で囲む。
2. <p>は、段落に用いるタグなので、<th><td>内が「文章」であるならば、<p>で囲むべき。
   「文章」ではない「単語」ならば、囲まなくて良い。
    

検索結果、1.ならば、テーブル②が正しい。
検索結果、2.ならば、テーブル①が正しい。

ただし、検索結果1.について、厳密に考えると、
<table>自体がブロック要素で、その中にインライン要素の<th><td>が入っているのだから、
さらにブロック要素の<p>で囲まなくてもいいのでは？とも思う。

それからもう1つ。

「body直下に文字やインライン要素を記述することはできない」

これ ↑ が前提にあるから、イメージタグ<img src="" alt="">は、<p>で囲んで記述していますが、
レイアウトで使う大きなくくり（ヘッダー・サイドメニュー・メイン・フッダーなど）を
<div>で囲っているのだから、<p>で囲む必要はないのかな？

それに、検索結果2.にあるように、本来<p>は、段落に用いるタグなので、
段落以外のイメージタグを囲むのは、よくないのではないか？とも思うわけです。




この疑問・・・・

わかる方がいたら、

是非教えてくださいませ m(_ _)m

---

ランキング参加中、励みになります。
一押し、よろしくお願いします。


別途、ブログ村のランキングを見る。