• ベストアンサー

ボタンを画の左に・・

HP上に、左に画(画像)、右にテキストを挿入したいのですが、どうしても画像の下にテキストがいってしまいます。 img=・・・・で画像を入れた後、そのままテキスト(タグ)を挿入しますと下に表示されます。 右に表示できませんか?

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

  • ベストアンサー
  • domi_rb
  • ベストアンサー率39% (60/152)
回答No.7

#4,#6で答えたものです。 テキストエリアに入力した文字で、あふれた部分を画像の下に持っていきたいということでよろしいでしょうか? そうしましたら、画像共々テーブルタグに入れてしまいましょう♪やり方は…わかりますよね?

matrix4
質問者

お礼

ありがとうございます

matrix4
質問者

補足

すいません!! あふれた部分ではなく、テキスト(ここでは)下にスペースがあるにもかかわらず、次のタグを画の下に持っていきたいのです。 このままでは、テキストの下に続いてしまいます。

全文を見る
すると、全ての回答が全文表示されます。

その他の回答 (7)

  • the845t
  • ベストアンサー率33% (246/743)
回答No.8

テーブルの外に入力していったら?

matrix4
質問者

お礼

ありがとうございます

全文を見る
すると、全ての回答が全文表示されます。
  • domi_rb
  • ベストアンサー率39% (60/152)
回答No.6

#4で答えたものです。 イメージとしては ------------         ボタン  ボタン   画像         ===テキスト=== ------------ という感じでよろしいでしょうか? そうしましたら、ボタンとテキストをテーブルに入れてください。そのテーブルを画像の右側に置いてください。テーブルはわかりますよね?このやり方が一番早いですよ^^ でわでわ。

matrix4
質問者

補足

ずばり、ありがとうございます。 できました!! <TABLE BORDER="0"> <TR ALIGN="left"> <TD><INPUT TYPE="submit" NAME="登録" VALUE="登録></A><INPUT TYPE="reset" VALUE="リセット"></TD> </TR> <TABLE BORDER="1"> <TR ALIGN="left"> <TD><TEXTAREA NAME="テキスト" COLS="40" ROWS="5" WRAP="off"></TEXTAREA> </TD> <TD></TD> </TR> </TABLE> そこで、新たにですがそのあとに続けるとテキストの下に表示されて余った分は画の下にいくのですが、新しい部分は”画のした”に持っていきたいのです。 "bottom"を使うみたいですがどこでつかいましょう・・?

全文を見る
すると、全ての回答が全文表示されます。
  • kaz_iwa
  • ベストアンサー率27% (10/37)
回答No.5

align属性は今後廃止予定なのでスタイルシートを使ってみては?。 (例 <body> <div style="float: left"> <img src="./hogehoge" width=200 height="200"> </div> <div> ああああああああああ<br> いいいいいいいいいい<br> うううううううううう<br> </div> </body> 回り込みを解除する場合には <div style="clear: left"> ~~~~~</div> で解除できます。 お試しあれ

matrix4
質問者

お礼

ありがとうございます

全文を見る
すると、全ての回答が全文表示されます。
  • domi_rb
  • ベストアンサー率39% (60/152)
回答No.4

こんにちわ。 この質問は「HTMLタグ【まわりこみ】」についてですよね。 ずばり回答から書かせていただきます。 ----------------------------------- ホームページ<BR> <IMG Src="画像のファイル名" Align="left"> 文字の回り込みの例です。左にイメージを表示した場合は、右に文字が表示されます。 ----------------------------------- とすればOKです。 要は、”Align="left"”がミソですね~。 rightと記載すれば、文字が右に回り込みますよ。 くれぐれもスペースは半角で打ってくださいね。 でわ、素敵なHPを作成してください!

matrix4
質問者

補足

例えばですが、 <IMG SRC="My%20Pictures/14.jpg" ALT="" WIDTH="600" HEIGHT="400" ALIGN="top"><INPUT TYPE="submit" NAME="" VALUE="登録"><INPUT TYPE="reset" VALUE="リセット"> <TEXTAREA NAME="" COLS="40" ROWS="5" WRAP="off"></TEXTAREA> というふうに、(画像はでませんが・・)画像の横に ボタンは表示できますが、ボタンが2つ以上並べると テキスト欄が下にいってしまいます。 ボタンの下にテキスト欄を表示できませんか? つまり、align=leftでフォームとテキストを上下に並べて 表示する・・ですが・・

全文を見る
すると、全ての回答が全文表示されます。
  • shy00
  • ベストアンサー率34% (2081/5977)
回答No.3

一番簡単な方法はborderが0のtableを組みましょう または、回り込みをさせましょう http://www.aux-web.com/webbox/support/image_01.html など参考に・・・

参考URL:
http://www.aux-web.com/webbox/support/image_01.html
matrix4
質問者

お礼

ありがとうございます

全文を見る
すると、全ての回答が全文表示されます。
noname#10926
noname#10926
回答No.2

align="left"を使う。 <IMG src="***.gif" align="left">ホゲホゲ テーブルを使った方がバランスよくできる場合もありますね。

matrix4
質問者

お礼

ありがとうございます

全文を見る
すると、全ての回答が全文表示されます。
  • mohao
  • ベストアンサー率15% (10/63)
回答No.1

テーブルタグを使ったらいいと思います。 例) <table> <tr> <td><img src="・・・"></td> <td>文章</td> </tr> </table> また、参考URLによると、imgタグの中に align="top" とか align="middle" を指定する方法もあるようです。

参考URL:
http://www5a.biglobe.ne.jp/~n_rieko/html/4.htm
matrix4
質問者

お礼

ありがとうございます

全文を見る
すると、全ての回答が全文表示されます。

関連するQ&A

  • 画像を少しだけ左に寄せる方法教えて下さい

    ホームページをつくっています。 ある画像を <Div Align="right"><img src='画像URL' border=0></Div> <Div Align="right">画像の下に名前</Div> というタグで表示しましたが、どうも右端にピッタリ行き過ぎてしまいます。大体3~4センチ左に移動して表示するにはどうしたら良いでしょうか? ご教示いただけるとありがたいです。

  • フレームで左から右へいきません。

    フレームを使っているのですが、左の縦長フレームと上の横長フレームを残したまま左のフレームから右のページに絵を表示させたいのです。 でも、そういう左から右へ表示させるタグ(Frame name="**")を使っても右のページに表示されず次のページに表示されてしまいました。 たぶん上の横長のフレームが邪魔をしているのだと思うのですが・・・。(前、横フレームなしで使っていたときは普通に左から右に表示されたので) HPを作るときに使っているのはメモ帳です。 それでも分からないところがあったら言ってください よろしくお願いします。

  • CSSで左に画像、右にテキストを並べたい。

    CSSで左に画像を置いて右にテキストを同じ列で並べたいのです。 (●=画像 ▲=テキスト) 現在の表示は ●▲ となっているのですが、これを ●     ▲ と表示して画像は左端、テキストは右端にしたいのです。<td>で区切ればできると思うのですが、これをCSSだけで何とかできないでしょうか? 色々試したのですが、どうしても下のように改行してしまいます。 ●       ▲ ソースは以下です。 <table border="0" cellpadding="0" cellspacing="0" width="750" > <tr> <td colspan="2" id="head"><img src="img/777.gif" border="0">おはよう</td> </tr> </table> 外部CSS #head{background-color:#009900 width:750px; height:60px; margin-right:5px} どなたか宜しくお願い致します。

    • ベストアンサー
    • HTML
  • HTMLに横型ゲージを表示させたい

    私はCGIゲームを作成しているのですが、 HTMLのページにゲージを表示させる方法が 全くわかりません。 よく、ゲームであるようなHPゲージのような感じです。 静止画ページなので、 imgのwidthをスクリプト内で計算して、 <img ~現HP~><img ~最HP~>という感じで正直微妙な感じです javascriptでもいいのでHTMLに表示させる方法はありませんでしょうか? spanタグを使用して<img ~最HP~>代わりにして <img ~現HP~>のwidthを%化して 代わりにやってみたのですが、 テキストがないとspanの背景画像は表示されないようなので、 わかりません。

    • ベストアンサー
    • HTML
  • <p>の右寄せ、CSSの設定について

    お世話になります。 ブログを書いているのですが、imgタグ(classを"a"とします)を挿入するとHTMLでは自動でimgタグだけで前後が<p></p>で囲まれてしまいます。 このimg.aをCSSのfloatで右に寄せ、marginを設定しているのですが、続きの文章が同じ<p>の中に無いためか画像の左が丸々空白になり、画像の下の行から文章が始まるようになってしまいます。なおFirefoxでは画像の左は空白にならず、同じ高さから文章が始まっています。またこの<p>タグだけにクラスを割り振ることはできないようです。 この場合、Internet ExplorerでもCSSの設定などで画像の脇に文章を持ってくることはできるのでしょうか?それともなにか変なCSS設定を別にしてしまっている可能性が高いでしょうか? よろしくお願いします。

  • textareaに画像を表示したい

    textareaの入力支援を作成しています。 PHPで画像のディレクトリを開き別窓などに一覧表示させ、 その画像をクリックでjQueryでテキストエリアへタグを挿入。 <textarea id="test"> あああ <img src="hoge.jpg"> いいい </textarea> ↑のようにIMGタグを挿入する状態までは実装させることが出来るのですが、 UI的に、このIMGタグを画像(サムネ)として表示させたいと考えています。 <textarea id="test"> あああ ■(←画像) いいい </textarea> テキストエリアを監視して置換するなど方法はありそうなのですが そもそもテキストエリア内で画像を表示させることができるのでしょうか? 何かいいアイディア、あるいはプラグイン等がありましたら教えてください。

  • 画像とその下にあるテキストの隙間を小さくする方法

    ワードプレスで画像を挿入し、その画像の下にテキストを表示させたいと思っています。 管理画面にある「メディアを挿入」の画面で「キャプション」にテキストを記入しました。 これで画像の下にテキストが表示されましたが、画像とテキストの間に広い隙間が出来てしまっています。 この隙間をなくそうと、テキストの部分にクラスを設定し、そのクラスに対してCSSから「margin-top: 0px;」などと記述したのですが、変化がありませんでした。 また、imgタグの最後に「style="margin-bottom: 0px;"」を追加しても変化がありませんでした。 画像とその下にあるテキストの隙間を小さくするためにはどうすればよいのか教えて下さい。

    • 締切済み
    • CSS
  • 画像の表示につきまして

    こんにちは。お世話になります。  画像の表示について伺いたいことがございます。  現在、HPを作成しています。そこには、横並びで三つの画像を配置しています。  しかし、そのHPをいつ開いても、表示されるのは一番左の画像のみで、真ん中と右の画像は表示されません。  ただし、マウスポインタを当てると、真ん中の画像も右の画像も表示されるようになり、以降は、画像が消えるような事はないのですが、その後、そのHPを閉じて、また開くと、同じように真ん中と右のみ表示されません。  インターネットオプションの「画像を表示する」にも、きちんとチェックが入っていますし、他のPCで開いても同様の結果になります。  こういう場合、どういった不具合が考えられるでしょうか。また、改善方法はありますでしょうか。  因みに、下記のようなタグを使っており、マウスオーバーすると画像が切り替わるようにしてあります。 <p class="img"><a href="http://●●●"><img width="235" height="120" onmousedown="this.src='http://●●●/img1.jpg'" onmouseout="this.src='http://●●●/img1.jpg'" onmouseover="this.src='http://●●●/img1_on.jpg'" alt="画像" src="this.src='http://●●●/img1.jpg'" / border="0"></a></p>  windowsXP IE6.0を使っております。  皆様、お忙しい中恐れ入りますが、ご教示下さい。宜しくお願い致します。

    • ベストアンサー
    • HTML
  • 「写」3画め、「考」5画目の横棒について

    『「写」の3画めの横棒は左から右に書く』であっていますか。 『「考」の5画めの横棒は右から左に書く』であっていますか。 よろしくお願いします。

  • Image::Magickでサムネイル画の表示

    Image::Magickでサムネイル画の表示するCGIです ./image       属性は777 /$fmain_no.jpg    属性は644 サムネイル画を表示するとプロバイダーのサバーに保存されている画像も小さくなってしまいました、困っています、 サバーにある画像はそのままで画像を読んでサムネイル画を表示するようにしたいのですがよろしくお願いします。 use Image::Magick; $img_file = "./image/$fmain_no.jpg"; $height = 200; $i = Image::Magick->new; $i->Read($img_file); $i->[x]->Scale("x$height"); $i->Write("$img_file"); print "<IMG SRC=\"$img_file\" BORDER=0>\n";