Q&A
この質問に <img> は関係ありますか? 「pタグの中にpタグやh2タグは入れられないのでdivにする必要があるか?」という質問では十分ではないのでしょうか。
実現したいこと
imgタグをpタグで囲み、更に文章をpタグの中に入力したい。
該当のソースコード
<p><img></p>なら問題ないですが画像とテキストを一緒に囲みたい場合はpタグの中にpタグやh2タグは入れられないので
<div><img><p>テキスト</p></div>とするしかないのでしょうか？
ソースコード
試したこと
ここに問題に対して試したことを記載してください。
補足情報（FW/ツールのバージョンなど）
ここにより詳細な情報を記載してください。
その画像が、どのような意味を持つかによりますので、
（見た目のみなのか、画像文字のように、文章的意味があるものなのか）
そこらへんの画像の用途を教えてください。
手段より具体的に実現したいレイアウトについて聞いた方が根本的な解決とスキルに繋がると思います。
あと自身で試したこととその結果も追記してください。
pタグはタグ省略による自動クローズがあるので、『pタグの中にpタグやh2タグは入れられない』というのはご理解の通りです。
ただ、pタグの中にブロックレベルボックスを入れることができないというわけではないですので、他のタグで書いてCSSで見た目を合わせることはできます。何をしたいのか書いた方が有効な回答が得られるかもしれません。
すいません、全く情報不足でした。
画像の下に説明文というか文章をつけたい場合です。
自分で調べるとは本文に関係があるかどうかの区別でpタグかfigureタグを使い分けると分かりました。
またfigcaptionというタグで簡単に説明文がつけられました。
<figure>
<img src="/media/cc0-images/elephant-660-480.jpg" alt="Elephant at sunset" />
<figcaption>An elephant at sunset</figcaption>
</figure>
これで、表示は出来ましたが画像の性質上、pタグを使うべきだと思いましたので質問させて頂きました。
分かりにくく申し訳ありません。
セマンティクスのお話だったのですね。
figure 要素を構成するような独立した図表であれば、p 要素でラップする必要はないように思います。
たとえば、リストがそれ単体で段落を構成しているように見えても、ol,ul,dl などを p でラッピングするようなことはないのと同様に考えてはいかがですか？
もし、その画像が何らかの段落に属していると考えるのであれば、yambejpさんのご回答のようにそのままテキストを続ければいいように思います。
質問は編集できますので、原則質問本文へ
回答1件
0
ベストアンサー
ちょっと質問の意図がわかりかねるのですが
以下NGだとして
HTML
1<p>1<p>2</p>3</p> 2<p>4<h2>5</h2>6</p>
以下OKですが、こういうことではない？
HTML
1<p>7<img>8</p>
投稿2023/08/31 09:04
総合スコア117714
みなさま、有難うございました。
私は根本的な勘違いをしていたようです。
htmlタグを殆ど暗記に近い形で覚えていた為、
h1タグ→見出しなんだから文字なはず
pタグ→段落なんだから文章
という形式的で固まった思い込みがあったようです。
なのでyambejpさんの<p>7<img>8</p>なんて考えもしなかったです。
もっと内容面、実質面を見るべきなんですね。
有難うございました。
あなたの回答
tips
プレビュー
