みんなの「教えて(疑問・質問)」にみんなで「答える」Q&Aコミュニティ

こんにちはゲストさん。会員登録(無料)して質問・回答してみよう!

締切り済みの質問

ブログのメニューバー内に画像表示をしたいのですが

どうかお助け下さい。

以下の画像のように、メニューバー内のテキスト隣に画像表示をしたいのですが・・・
http://blog-imgs-54.fc2.com/p/a/c/pachislo777question/2012y06m13d_134350964.jpg
http://news4vip.livedoor.biz/
どうしてもうまくいきません。

以下のURL先にあるメニューバー表示方法を使ったのですが・・・
http://10plate.blog44.fc2.com/blog-entry-176.html
どうしても↓のようにズレが出てしまいます。
http://blog-imgs-54.fc2.com/p/a/c/pachislo777question/2012y06m13d_134411361.jpg

具体的には以下のように設定しました。

▼HTMLタグ

<ul id="menu_bar">
<li><a href="<%url>" style="width:120px;">トップページ</a></li>
<li><a href="http://pachislo777question.blog.fc2.com//?xml" style="width:70px;"><Img Src="http://blog-imgs-54.fc2.com/p/a/c/pachislo777question/RSS.png" Width="30" Height="30">RSS</a></li>
<li><a href="<%url>" style="width:120px;">???</a></li>
<li><a href="<%url>" style="width:120px;">???</a></li>
<li><a href="<%url>" style="width:120px;">???</a></li>
<li><a href="<%url>" style="width:120px;">???</a></li>
</ul>


画像に対してAlignタグでテキストを回り込ませると、”RSS”のテキストが自動で中央中段表示になっているようで、どうしても崩れてしまいます。
又、ボタン自体を画像表示させようとも考えたのですが、やはり崩れるようで諦めました・・・


どのようにすればメニューバー内に画像を表示させる事ができるでしょうか?
どうぞよろしくお願いします。

投稿日時 - 2012-06-13 14:52:05

QNo.7531041

すぐに回答ほしいです

このQ&Aは役に立ちましたか?

0人が「このQ&Aが役に立った」と投票しています

回答(1)

ANo.1

画像は背景画像にする。
<li>の背景にするか、<a>の背景にするか?は、ケースバイケース

<li style="background: url(http://blog-imgs-54.fc2.com/p/a/c/pachislo777question/RSS.png) no-repeat 2% 50%;"><a href="http://pachislo777question.blog.fc2.com//?xml" style="width:70px;">RSS</a></li>

投稿日時 - 2012-06-14 00:55:09

補足

下記のように設定してみましたが、どうもうまくいきませんでした・・・

■<li style="background: url(画像URL) no-repeat 2% 50%;"><a href="指定先URL" style="width:70px;">RSS</a></li>


宜しければコチラもお願いします。
http://oshiete.goo.ne.jp/qa/7531024.html

投稿日時 - 2012-06-14 07:44:35

あなたにオススメの質問