初心者必見！画像横に文字を入れる方法を解説

2015/12/15 09:51

このQ&Aのポイント

web制作初心者の方へ、画像右側に文字を入れる方法をご紹介します。
htmlとcssを使用して、簡単に実装することができます。
具体的なコード例も紹介しているので、ぜひ参考にしてください。

kikinchan
お礼率0% (0/2)

みんなの回答 （2）
専門家の回答

質問者が選んだベストアンサー

ベストアンサー

chie65536（@chie65535）
ベストアンサー率44% (8835/20032)

2015/12/15 10:28 回答No.2

＞<li><a href="index.htm"><img src="画像"width=""height=""></a></li> ＞<div class="text">文字列</div> ＞<li><a href="index.htm"><img src="画像" width=""height=""></a></li> ＞<div class="text">文字列</text> 「</li>」でタグを閉じたら、その「リスト項目」はそれで終わりになってしまう。以下のように、文字列は「<li>と</li>の内側」に書かないといけない。 <li><a href="index.htm"><img src="画像"width=""height=""></a><div class="text">文字列</div></li> <li><a href="index.htm"><img src="画像" width=""height=""></a><div class="text">文字列</text></li>

ログインすると、全ての回答が全文表示されます。

その他の回答 (1)

t_ohta
ベストアンサー率38% (5407/14059)

2015/12/15 10:04 回答No.1

ブロックレベル要素は、基本的にそれだけで一段を構成するので上下で改行されます。単純に横に並べるだけなら <li><a href="index.htm"><img src="画像"width=""height=""></a>文字列</li> でいいはずです。また、<ul>の直下に<div>が居るのはおかしな記述です。<ul>の子要素は<li>か<script>である必要が有ります。

ログインすると、全ての回答が全文表示されます。