HP作成

質問

cssを勉強し始めたばかりです。どうぞ教えてください。
画像　画像　テキストと並べたいのですが、
テキストは2行<p>クラスと<strong>です。
<li>要素をつけて、display:inlineでやってみましたが、画像　画像　<p>改行されて<strong>が来ます。
どうぞよろしくお願いいたします。

回答No.1

t_ohta · ベストアンサー

<p>タグはブロックレベル要素なので前後で改行されます。
画像自体を<p>タグの中に入れると改行されないと思います。

お礼

早速のご回答ありがとうございます。
ブロックレベルインラインレベルが理解できないまま使っていました。
よく勉強します。どうもありがとうございました。

回答No.2

tracer

p要素のdisplayの初期値はblockです。
そのままのhtmlを使うなら、p要素にdisplay:inlineを設定してみてください。
もしくは、pタグの代わりに、display:inlineが初期値のspan要素を使うほうが自然かと思います。

ちなみに、よくあるリファレンスサイトの解説には、ブロックレベル要素とインライン要素というものがあるかもしれませんが、現在のブラウザの解釈(html5)としては、そのような概念は既にありません。現在では、見た目に関わる機能はタグそのものに関与せず、cssで調整します。古い情報に惑わされないようにご注意ください。

お礼

早速のご回答ありがとうございました。
ブロックレベルインラインレベルが経験不足でよく理解できていませんでした。html5は進化し、cssでスタイルするように統制がとれるようになったということでしょうか。よく勉強し経験を積みます。