- ベストアンサー
画像と文字を中心に表示するには…？
いつもお世話になっています。 最近よく思うのですが「画像」と同じ行に文字を書くと文字が下詰めに配置されてしまうのですがこれを上下の余白均等にすることはできないでしょうか？ <<現在>> ■■■■■■ ■■画像■■ ■■■■■■ 「文字を書くとこのように…」 ↓ <<希望>> ■■■■■■ ■■画像■■ 「文字がこの位置に配置したいです」 ■■■■■■ 今はタグで <img src="画像">文章～ という形で記述していますがもし修正できるようでしたらタグの方を教えていただければ助かります。 宜しくお願い致します。
- news_0203
- お礼率40% (327/800)
- ホームページ作成ソフト
- 回答数3
- ありがとう数0
- みんなの回答 （3）
- 専門家の回答
質問者が選んだベストアンサー
ご自分でタグを記述しているようなので <img src="xxx.jpg" width="xxx" height="xxx" alt="xxx" style="vertical-align:middle">文章・・・
その他の回答 (2)
- pasocom
- ベストアンサー率41% (3584/8637)
<img src="画像" align="middle">文章～ とすると、画像と文章がご希望のように並びます。 "middle"のかわりに"top"とすると文章と画像とが頭そろえになります。
関連するQ&A
- 画像に文字を回りこませる・・・じゃなくて、画像の隣に文字を記入させる
画像に文字を回り込ませることは出来るんですが、もう少し細かいことをしたくて質問させて頂きました。 <Img Src="画像URL" Align="画像の位置"> うえのタグを使って、画像を左に配置させたとします。当然文章は、画像の右側に書かれますよね。 ところが、画像の高さより文字の行が多いと、画像のしたに文字が入ります。当たり前ですがｗ これがイヤなんです。 画像の高さをこえても、そのまま画像の右側に文字を書きたいんですがどうしたらイイのでしょう？ ずっと画像のとなりに文章を書きたいんです。 ちょっと文章が分かりにくくて申し訳ないですが^^; 例をだすとしたのサイトの、左側に 「検索順位がみるみるアップする本―必要最小限のSEO知識でホームページを上位に表示!」 という本のリンクがありますよね？ 文字が、画像のしたに入り込んでいませんよね？ そんな感じにしたいんです^^; そういうタグをしらないので、無理に画像を大きくして、画像の下に文字が入らないようにしていました（汗） http://www.su-jine.com/sujine_seo_virtualgoogle.php
- ベストアンサー
- ブログ
- 画像の高さと文字位置
方法として思いつかないため、良いアイディアか方法があればご教授ください。ブラウザや環境により見え方がまちまちなのも承知の上です。 現在以下のような感じに文字と画像を組んでいるのですが、 <table> <tr><td valign="middle"><img src="**.gif" width="10" height="10"></td> <td valign="middle">てきすとてきすとてきすとてきすとてきすとてきすと</td> </tr></table> てきすとが２行になった時も画像が当然ながら高さの中央に配置されるため不自然になっています。できれば２行目が存在することになっても画像の高さをテキスト１行分の中央におきたいのですが何か方法ありませんでしょうか。 スタイルシート記述でもタグでも構いません。
- ベストアンサー
- HTML
- 文字を行の真ん中に配置したい
中央揃えのように文字を行の真ん中に配置するのはどのようにすれば、 出来ますか？ （行の中の上下の余白を均等にするということです。） 回答よろしくお願いします。
- ベストアンサー
- オフィス系ソフト
- テーブル内に画像を表示したい。
テーブル内に画像を1枚表示したいです。 下記のようにIMGタグを用いると、画像が表示されますが、 横幅が100％の時の大きさで枠が表示 されます。横に余白があります。 この余白を無くして、テーブルの枠線が画像をピッタリ 囲む様にしたいです。 どなたか、ご教授願います。初心者なので詳しくお願い します。 ---------------------------------------------- <table border=1> <tr> <td > <img src='./test_size/image2.jpg' width='50%' > </td> </tr> </table>
- ベストアンサー
- HTML
- 画像をページの中心にレイアウトしたい
現在、ホームページをHTMLタグ手打ちで作っています。初心者です。 画像をページの中心に配置してシンメトリーな印象のページにしたいと思っています。 使っているPCはMac OS Xです。 画像を中心に表示するのに以下のような形をとっています。 <center><img src="●●●.jpeg" alt="○○○"></center> このようなタグ設定の画像をsafariでチェックしたところ、ばっちりページの中心に表示されました。 しかしIEで確認したところ、ページの左端に寄ってしまっておりとても見栄えの悪いものになっていました。 画像を中心に持ってくるために<center></center>を用いるのは間違いなのでしょうか？ ベストなタグをお教えください。
- 締切済み
- レンタルサーバ・ASP
- 画像の上に文字を表示
スタイルシートなどの方法で、画像の上に文字を表示させることは可能でしょうか。 <IMG SRC=1.jpg ALIGN=BOTTOM BORDER=0> <IMG SRC=2.jpg ALIGN=BOTTOM BORDER=0> <IMG SRC=3.jpg ALIGN=BOTTOM BORDER=0> <IMG SRC=4.jpg ALIGN=BOTTOM BORDER=0> ・・・と延々と並んでいる画像の上に重ねてそれぞれの画像のタイトルなどを表示できればうれしい。 ＃マウスをのせて表示は除外。
- ベストアンサー
- 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
- 画像の横に文字をうまく配置できない
htmlで、画像の横に文字を配置したいのですが、下記の文章を入力しても、一行目の「タイ王国の伝統灰皿 \1,500」が画像の右下に配置され、「商品番号:a111」は画像の下に配置されてしまいます。ちなみにalign="right"と設定しても、なぜか上記（align="left"）と全く同じ配置になってしまいました。何か根本的に間違っているのでしょうか？ドリームウィーバーのデザインビュー上では思い通りのデザインになっているのですが・・・ ちなみにIEのバージョンは８です。どなたかアドバイスをお願いします。 <div id="contents"> <img src="img/商品（仮）.JPG" width="300 height="300"align="left"/> タイ王国の伝統灰皿 \1,500<br> 商品番号:a111<br clear="left"> </div>
- ベストアンサー
- HTML
- 画像の位置を指定するCSS
画像の位置を指定するCSS 文字の前にポイント画像を<img src="~.gif" alt="" />のタグで置きたいんですが、ずれて文字の上のほうに表示されてしまいます。 すごく簡単に文字の中央に表示されるように指定できるCSSのタグがありますがどんな記述だったか忘れました。 検索しても出てこないので困ってます。 どなたか教えてください。 ちなみに background: url(hogehoge.gif) no-repeat 10px 0.5em;list-style: none;} これではないです。 もっと簡単でtext-alignのようなかんじの記述です。でもtext-alignではないです。 middleみたいな記述があった記憶があるのですが確かかどうか自信ないです。
- ベストアンサー
- HTML
