- ベストアンサー
画像の横にリンクボタンを置きたいんですが
画像の横にリンクボタンを置きたいんですが <img align=left src="m38.jpg><br> <A HREF="right.html" STYLE="text-decoration:none;color:006633;">在りし日1</A> <br> <br> <A HREF="right1.html" STYLE="text-decoration:none;color:006633;">在りし日2</A> <br> <br> <br clear="all"><br> とやってみましたがうまくいきません。画像がでてきません。どうしたらよいでしょうか？
- papapa
- お礼率57% (56/98)
- HTML
- 回答数2
- ありがとう数0
- みんなの回答 （2）
- 専門家の回答
質問者が選んだベストアンサー
- ベストアンサー
あ、同じように書けば良かったですね。 すみませんでした。 <img align=left src="m38.jpg> ↓ <img align=left src="m38.jpg"> こうです。
その他の回答 (1)
実際にファイルを作って悪いところを検証したわけではないのですが、見てみると、いくつか気になる点がありました。 それらを対処すれば動くようになるかもしません。 以下のような点です。 <img align=left src="m38.jpg> srcの後の引用符がありません。 text-decoration:none;color:006633; CSSで、色を数字で指定する場合は、一般的に#を頭に付けます。↓ text-decoration:none;color:#006633; また、横に置きたいそうですが、imgの後にbrが入っているので横ではなく、下に表示されそうです。
関連するQ&A
- 画像を横に並べるには？
ブログでアフェリエイトをしたいのですが、画像の横に紹介文を回り込ませたり、また、画像の下に紹介文を入れたものを横に複数並べるにはどうしたら良いでしょうか？tableを使ったところレイアウトがずれてしまいした（忍者ブログを借りています）。 <a href=""><img src="" align="">紹介文</a><br clear""> <a href=""><img src=""><br>紹介文</a> まではできます。
- ベストアンサー
- ブログ
- css 背景画像（1つ）とリンク付き画像（複数）を中心に表示したい。（
css 背景画像（1つ）とリンク付き画像（複数）を中心に表示したい。（超初心者です。） 現在、Kompozerをつかってホームページを作成しています。 添付画像のような配置にしたいので、いろいろなサイトを参照したのですがどうしてもうまくいきません。 現在のソースは以下のようになっており、ブラウザで表示すると背景画像が表示されません。 あまりにも知識がなく、不快な思いをさせてしまったら申し訳ございません。 ご指導いただければうれしいです。 よろしくお願いします。 ＊ソース <html><head> <meta content="text/html; charset=Shift_JIS" http-equiv="content-type"> <title>ページタイトル</title> <style type="text/css"> </style> </head><body> <div style="text-align: center;" background-image:="" url ＊＊.jpg ;width:450px;height:450px;=""><br> <br> <img style="width: 137px; height: 137px;" alt="" src="＊＊.gif" border="0"><br> <br><p style="text-align: center;"> <a href="＊＊.html"><img style="border: 0px solid ; width: 92px; height: 230px;" alt="" src="＊＊.jpg"></a><a href="＊＊.html"><img style="border: 0px solid ; width: 92px; height: 230px;" alt="" src="＊＊.jpg"></a><img style="width: 92px; height: 230px;" alt="" src="＊＊.jpg"><a href="＊＊.html"><img style="border: 0px solid ; width: 92px; height: 230px;" alt="" src="＊＊.jpg"></a><br></p> </div> </body></html>
- ベストアンサー
- HTML
- 画像にリンクをつけたら、実線でかこまれた
バナーをつくり、それにリンクの指定をしたら、実線でかこまれてしまいました。 こんなことは初めてです。 <div class="top_left"><a href="index0.html"><img src="xx.png" width="558" height="119" ></a> </div> 単純な指定だとおもうのですが・・・。 お手数ですが、よろしくお願いします。 なお、 .link a { color: #111; } .link a:hover { color: #aaa; } .link a { text-decoration: none; } ほかの箇所で、文字のリンクの下線を消すために、cssで上のような 記述をしています。（関係あるかはわかりませんが・・・） 画像の箇所には、上記のスタイルは指定していません。
- ベストアンサー
- CSS
- リンクの下線を破線にしているのですが…
リンクの下線を破線にするスタイルシートを使用しているのですが、 通常の左寄せや<center>タグで囲ったテキストでは正常に動作するのに、 <div align="right">または<p align="right">で囲った右寄せのテキストには破線が表示されません。 どうすれば表示されるようになるでしょうか。 私が使用しているスタイルシートは以下の通りです。 <style type="text/css"> <!-- A:link {color:#666666; text-decoration:none; border-bottom:1px dashed #00CCCC;} A:visited {color:#666666; text-decoration:none; border-bottom:1px dashed #00CCCC;} A:hover {color:#FF3300; text-decoration:none; border-bottom:1px dashed #00CCCC;} --> </style>
- ベストアンサー
- その他（インターネット・Webサービス）
- プルダウンメニューの表示
+のgifをクリックすると-のgifと詳しい表示が出る様にHTMLを書いたのですが、 表示された後で閉じると、その+のgifが再表示されません。 何が足りなくてそうなってしまうのでしょうか？ また、親メニューの+が-になっている時、gifの-を表示させる方法を教えてやって下さい…。 よろしくお願いします。 <body bgcolor="#000000" text="#ffffff" link="#000000" alink="#808080" vlink="#ff0000"> <div id='div1' style="position:absolute; left:10; top:100; width:250;"> <a id="menu1" href="#" onClick="onmenu(this,'menu11');return false" style="text-decoration:none;"> <img src="p.gif" alt="+" border="0"></a><font size="+2">BBS</font> <div id="menu11" style="position:absolute; left:-2; top:16; visibility:hidden;"> ├<a href="http://…" target="_top" style="text-decoration:none;"> <img src="m.gif" alt="-" border="0"></a> aBBS<br> ├<a href="http://…" target="_top" style="text-decoration:none;"> <img src="m.gif" alt="-" border="0"> </a> bBBS<br> └<a href="http://…" target="_top" style="text-decoration:none;"> <img src="m.gif" alt="-" border="0"></a> cBBS </div></div></div> </body>
- ベストアンサー
- HTML
- 初心者です 画像横に文字を入れたい ｃｓｓ
web制作を始めたばかりの初心者です。 画像右側に文字を入れたいのですが、うまくいきません。 本当にはじめたばかりでなんとなくcssの意味が分かりかけたところです。 どうぞご教示ください。 html <ul> <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> </ul> </div> css .site ul {margin: 0; padding: 0; list-style: none} .site li a {display: block; padding: 5px; font-size: 14px; text-decoration: none} .site li a img {border: none } .site a:after {content: ""; display: block; clear: both} .site img {float: left; width: 250px} .site .text {float: none; width: auto; margin-left: 60px; padding-left: 15px; color: #000000; font-size: 18px}
- ベストアンサー
- その他（インターネット・Webサービス）
- ▲▲パソコンの中ではリンクできるが、INET上ではPageが表示されない。。。▲▲
このように作成しました。INET上ではリンクできません。助けててください。</head>より上はカットしました。 <body> <hr color="#0000FF" style="filter:alpha(opacity=100,finishopacity=0,style=3);" width="350"> <font size="3"><div align="center">Hand-made HTML</div></font> <hr color="#0000FF" style="filter:alpha(opacity=100,finishopacity=0,style=3);" width="350"><br> <br> <font size="2"><div align="center">本日は、Hideyuki.comのHTML講座にお越し頂きまして、ありがとう御座います。<br> ここでは、HTMLについてご説明しています。勿論サイト自体も、手打ちで作っています。<br> 心行くまで、楽しんでいって下さい。</div></font></td> <br> <HR color="#777777" style="filter:alpha(opacity=100,finishopacity=0,style=3);"> <br> <br> <font size="3"><a href="Hand-made_HTML_HTML概要.html" style="text-decoration:none;">■HTML概要</a></font><br> <font size="2">- HTMLを簡単に説明しています -</font><br> <br> <font size="3"><a href="Hand-made_HTML_HTML基本.html" style="text-decoration:none;">■HTML基本</a></font><br> <font size="2">- HTMLの基本をご説明しています -</font><br> <br> <font size="3"><a href="Hand-made_HTML_Web概要.html" style="text-decoration:none;">■Web概要</a></font><br> <font size="2">- HTMLを深く学ぶ前に少しWebの勉強をしましょう -</font> </body> </html>
- ベストアンサー
- HTML
- 【Html CSS】<a>の上に文字を配置したい
添付の画像の様にしたいです。 一番左には「ＳｏｌｄＯｕｔ」って文字が一番上に配置されてます。 （この状態でhoverも<a>のリンクも効かせたい） 以下は、ソースです。これを添付の画像の様にしたいです。 <html> <head> <meta http-equiv='Content-Type' content='text/html; charset=utf-8'/> <meta http-equiv='Content-Style-Type' content='text/css'> <style> img{ border: 0px; vertical-align: middle; } .box li{ float: left; list-style:none; } .box .out{ border-right: 10px solid #fff; border-top: 10px solid #fff; } .box a { text-align: center; display: block; text-decoration: none; font-weight: bold; color: #69380f; background-color: #f2f2f2; width: 100px; height: 120px; } .box a:hover{ background-color: #ccc; } </style> </head> <body> <ul class='box'> <li><div class='out'><a href='javascript:void(0);'>hoge<br><img src='shop.cgi?img=1'><br>300円</a></div></li> <li><div class='out'><a href='javascript:void(0);'>hoge<br><img src='shop.cgi?img=1'><br>300円</a></div></li> <li><div class='out'><a href='javascript:void(0);'>hoge<br><img src='shop.cgi?img=1'><br>300円</a></div></li> </ul> <br> </body> </html> 以上、ご指導の程、宜しくお願いいたします。
- ベストアンサー
- CSS
- ツイスターのブログパーツ貼れない！
ツイスターのブログパーツ貼れない！ gooブログで、 <div align="center"><a href="http://twitter.com/lovemusic" target="_blank"><img src="http://twimg.info/src/?id=lovemusic" width="160" height="240" border="0"></a><br><a href="http://twimg.info/" style="text-decoration:none"><span style="font-size:9pt">Powered by ついめ～じ</span></a></div> と、 ここのサイト http://twimg.info/ つかって生成したけど貼れないのは試用？
- ベストアンサー
- アンケート
- バナーを横に並べたい
バナーを横に並べたい 検索サイトのリンクバナーを横に並べたいのですが、そのまま貼り付けると 縦にばかり並んでしまいます。横に並べるにはどこを変更すればよいでしょうか。 <!-- e-shops 投票バナー ここから --> <TABLE border="0" cellpadding="0" cellspacing="0" style="border: 2px #ffcccc outset; word-break:normal;"><TR><TD style="background-color:#ff9933; text-align : center;"><IMG src="http://img.e-shops.jp/vt/img211.gif" width="95" height="15" border="0" alt="手芸"></TD></TR><TR><TD style="background-color:#ff9933; text-align : center;" nowrap><A href="http://www.e-shops.jp/sh/rk188/html/" style="font-size : 11px; text-decoration : none;font-weight: normal;background-color:#ff9933; color: #ffffff; line-height:110%;" target="_blank">手芸</A></TD></TR></TABLE> <!-- e-shops 投票バナー ここまで --> よろしくお願いします。
- ベストアンサー
- HTML
補足
srcの印用符ってどういうものでしょうか？ <img align=left src="m38.jpg>で4いうと どんな感じになるのでしょうか？