- 締切済み
画像と同じ行に文字を並べると文字が上にずれてしまいます。
ホームページ作成時の以下のテクニックについて教えてください。 画像と同じ行に文字を記入すると、文字が少し上にずれてしまいます。 例えば、フォントを10ポイント、行間隔を14ポイントしたとき、1px×1pxくらいのミニ画像を文字と同じ行に入れると、その画像の入っている行だけが少し上にずれてしまいます。これを修正する良い方法はありませんでしょうか。 なお、テーブル（表）などで区切って調節するような方法は、行換えなどの点で面倒なので、これ以外の方法をお教えください。 宜しくお願いします。
- hanacoara
- お礼率0% (0/3)
- ホームページ作成ソフト
- 回答数3
- ありがとう数2
- みんなの回答 （3）
- 専門家の回答
みんなの回答
- sa_ya07
- ベストアンサー率36% (49/136)
ソースありがとうございました。 当方でも再現ができました。 どうもテーブル内にイメージがある場合、 line-height指定は効かないようです。 面倒かもしれませんが、どうしても行間を指定したいようでしたら 面倒ですがテーブルを使用するしかないのではないでしょうか？ お役に立てず申し訳ありません。 頑張ってくださいね。
- sa_ya07
- ベストアンサー率36% (49/136)
状況は分かりましたが、 私の方では再現できませんでしたので (ちなみに文章のフォントや間隔は<div class=～>で指定しました) もしよろしければソースを公開頂ければと思います。
- ----------
- ベストアンサー率30% (30/98)
状況がよくわかりませんが、 imgのところを <img src="～" align="left">とalignを付け加えてみればどうなりますか？
補足
うまく説明できなくてすみません。 例えば、 1行目の文章○△です。 2行目の文章○△（ここに画像を配置）□△です。 2行目の文章○△です。 という文章があったとき、画像の入り込んだ2行目だけが上に浮き上がってしまうのです。原稿作成時はそのように見えないのですが、プレビュー表示してみると、明らかに1行目と2行目の行間隔が狭くなってしまいます。 ちなみに、1ピクセルの画像というのは、アフィリエイトのテキスト広告なので、構文改変となるようなalignなどは付け加えることができません（ついでにいうと、leftとしても何の変化もありません）。 説明不足ですみませんでした。皆様からのアドバイスをお待ちしています。
関連するQ&A
- 行送り・文字送り間隔・文字の大きさを一括で処理したい。
みなさん、こんにちは。 今、サイトの模様替えをしていて、普通のサイトのような文字間隔ではなく、行送り間隔と文字送り間隔に、少し隙間を空けて表示できるようにしたいのです。また、ついでに文字の大きさも、あらかじめ一括で指定したいです。 もしかして、このカテゴリー（HTML）に適していなかったら申し訳ないのですが、是非方法を知りたいです。 今は検索して、一応spamタグとfontタグを利用していますが、タグを打ち込むのに相当てこずってしまうからです。 注文が多くて申し訳ないのですが、出来るだけ沢山のブラウザ（？）で反映される方法を希望しています。 何かいい方法がありましたら、よろしくお願いします。
- 締切済み
- HTML
- IE6,7で画像の上に載せた文字がずれる
HTMLなのですが、 画像が縦に3つつながって1つの画像のようになった状態で表示しようとしています。 さらに上と下の画像にはテキストを上にかぶせて表示します。 画像全体にリンクを貼ってあります。 下記のようなコードで作成した所、IE6,7でのみ、下記のバグが出てしまいました。 ・画像とテキストの縦位置のズレ ・画像間に2px程度の空白が生じる ・画像に設定したリンクが開かない 大変困っています。 どなたか原因と修正方法を教えていただけますでしょうか。 <a href="test.html"> <div style="position: relative; width: 183px; height: 265px; "> <img src="images/top.jpg" width="183" height="36" /> <div style="position: absolute; top: -11px; left: 55px;" class="font16b"> <p align="center">text1</p> </div> <img src="images/main.jpg" width="183" height="193" border="0" /> <img src="images/bottom.jpg" width="183" height="36" /> <div style="position: absolute; top: 218px; left: 4px; width: 181px;" class="font13"> <p align="left">text2</p> </div> </div> </a>
- ベストアンサー
- CSS
- Wordで複数行にまたがる画像
Wordで解らない事があるので質問させて頂きます。 ひとつめはタイトルに書いた通りなのですが、 複数の行にまたがる形で画像を入れたいのです。 今現在、タイトルが大きめの文字で書かれており、あとは普通に 上から下まで横書きで文字が書かれています。 例↓ --タイトル-- --内容-- --内容-- --内容-- 上記に、 --タイトル-- --内容-- |￣￣￣￣| --内容-- | 画像 | --内容-- |＿＿＿＿| この様な感じで画像を入れたいのですが、うまくできません。 こういう事は出来ないのでしょうか？ 次に文字の間隔です。 書式⇒フォント⇒文字幅と間隔 のところで 文字間隔⇒狭く 間隔⇒1pt としているのですが、変化がありません。 タイトルの文字サイズは24 それ以外は12としていて、間隔は8にしていますが、もっと狭くしたいのです。出来れば今の半分ぐらいまで。 この様な事は可能でしょうか？ 当方が使用しているのでWord2000です。 宜しくお願い致します。
- ベストアンサー
- オフィス系ソフト
- 背景画像をもっと上に移動したい
下記サイトのtableの中の背景画像の白い星が文字とかぶりやすいのでもっと上に移動したいのですが、 したぞろえで背景を上にずらすことは出来ないのでしょうか？ http://sample1.digi2.jp/yufu/index.html td.copyright { background: url(img/base/futterback.png) center bottom no-repeat; width: 567px; height: 133px;/*背景画像の縦幅*/ font-size: 16px; vertical-align: bottom; text-align: center; font-weight: 500; color: #FFF; font-family: 'webhannari'; }
- ベストアンサー
- CSS
- 画像上に文字を表示するとiPhoneで位置がずれる
ホームページで時間に応じて2行のテキストを時計画像の上に表示したいのですが 以下のCSSを使った方法ではPCやアンドロイドではズレないで表示されます。 ただし親のiPhoneを借りて見ると 何故か文字位置が下の方にずれてしまい画像から文字がはみ出してしまいます。 ブラウザは標準ではいってるやつ（Safari？）です。 <div style="position: relative;"> <img src="hoge.jpg" width=250 height=46> <div style="position:absolute; top:6px; left:20px;"> <table border=0 cellspacing=0 cellpadding=0> <tr><td>この文章は</td></tr> <tr><td>サンプルですよ</td></tr> </table> </div> </div> どうもiPhoneのSafariはフォントサイズを自動で調整する機能があるそうで それを解除するために以下のCSSを追加してみました。 -webkit-text-size-adjust: none; このCSSを追加するとフォントサイズは変えていなくても表示は小さくなり 位置ずれはマシにはなりました。 が、それでも行間が大きいためか画像からははみ出しています。 テーブル部分を2個に分離してそれぞれ位置を修正すれば、と思ったのですが それだとSafari以外は詰まって表示されてしまいますよね・・・シクシク。 他のブラウザならともかくiPhoneの標準ブラウザなので何とか直したいです。 これを修正できる方法をご存知の方はおられますでしょうか？ 画像の上に文字を表示できるのでしたら、 上記のCSSとはまったく別のものになっても構いません。 よろしくおねがいします。
- ベストアンサー
- CSS
- WORD 2007 1行の文字数設定
WORD 2007 1行の文字数設定 こんにちは。 英文の書類をもらい、それをそのまま書き出すように言われました。 1行目はインデントの左右を0.5に設定すると、原文と同じ文字から2行目に改行されました。 しかし、 2行目の終わりがおかしいのです。 終りの単語はあっていますが、1行目の左端と揃いません。 自動で文字の間隔やスペースの幅を1行目と同じように調節してくれると思うのですが、設定方法を教えてもらえないでしょうか？ よろしくお願いします。
- ベストアンサー
- オフィス系ソフト
- フォントサイズ変えたら、文字数行数がおかしく
マイクロソフトのワードを使って、レポートを書いています。 1ページの設定が、1行25文字。1ページ40行になるように、という指定があります。 これまで、それで問題なくやっていました。 変更がありました。 「あ。でも12ポイント以上の文字の大きさにして」、という新しい条件が付け加わりました。 指示にしたがって、ページ全体のフォントの大きさを10.5 から １２に変えました。 すると、自動的に 【１行２２字 １ページも３５行】になってしまいました。 今度はこの字数と行数を調節しようと「ページ設定」に行ったのですが、 そこをみると 【１行２５文字 １ページ４０行】 という設定になっていました。 文字の大きさ 文字数・行数設定 以上２つの条件を同時に満たすためには、どうしたらよいでしょう？？
- ベストアンサー
- Windows XP
- 画像の右下に複数行の文字
gooブログを利用しています。 画像の「右下」に、「複数行」の文章を回り込ませる方法を教えて下さい。 下記のようなイメージです。(■の部分が全部で1枚の画像です) ■■■■■■ ■■■■■■ ■■■■■■ ■■■■■■ 文字文字文字 ■■■■■■ 文字文字文字 色々探してみたのですが、 (1)leftのタグを使う「画像の右側(上から)複数行」 (2)bottomのタグを使う「右下側に1行のみ(？)」 しか見つかりませんでした。 タグの知識はあまりないので、これらを同時に使う事ができるのかとか(あるいはできないのでしょうか？)、分かりません。 どうぞご教示お願いします。
- ベストアンサー
- ブログ
- イラストレーターで文字画像(背景透明)をキレイにweb用書き出ししたい
イラストレーターで文字画像(背景透明)をキレイにweb用書き出ししたいのですが。 イラストレーター10.0 OS WindowsXP イラストレーターでテキストを入力し、 それを背景透明でweb用にgif画像で書き出ししました。 サイズは横177px,縦70pxです。 その中に文字を3行。1行目はフォントサイズ24くらい。 2,3行目はその細くなのでフォントサイズ10くらいです。 作っている画面では拡大してももちろんきれいなのですが、 そのきれいに見えているまま、書き出せないものでしょうか？ プレビューされる画像はギザギザで文字もほぼつぶれてしまっています。 これをキレイにつぶれないように書き出すにはどうしたらいいでしょうか？ やってみたこと アンチエイリアスにはチェックがついています。 アウトラインってのもよくわかりませんが、しました。 最終的にやりたいことは、 HPで背景を塗りつぶした表があり、その1行目のタイトル部分は画像にしたいです。 文字の色は白、背景を透過させて書き出したいと思います。 背景に色を付けてjpegというのは今回はやらずにいたいと思います。 質問するのに説明不足でしたらすいません。 あまり知識がないので、必要な情報があったら聞いてください。 よろしくお願いします。
- 締切済み
- 画像・動画・音楽編集
補足
ソースは、以下のような感じです。「まみむめも」の部分がリンクになっていますが、「ま」の前に1ピクセルの画像が入っています。この画像の上下の行間が、他の行間よりも多少狭くなってしまいます。 ご確認いただければ幸いです。よろしくおねがいします。 <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.0 Transitional//EN"> <HTML> <HEAD> <META http-equiv="Content-Type" content="text/html; charset=Shift_JIS"> <TITLE></TITLE> <style type="text/css"> <!-- body,td,th { font-size: 10pt; } IMG{border-style : none none none none;} //--> </style> </HEAD> <BODY topmargin="0" marginheight="0" leftmargin="0"><CENTER> <CENTER></CENTER> </CENTER> <TABLE width="200" cellpadding="8" cellspacing="0"> <TBODY> <TR> <TD style="font-size : 12pt;line-height : 22pt;"> あいうえおかきくけこさしすせそたちつてとなにぬねのはひふへほ<A href="http://ck.jp.ap.hogehoge.com/" target="_blank"><IMG src="http://ad.jp.ap.hogehoge.com/" height="1" width="1" border="0">まみむめも</A>やゆよらりるれろわをん。 あいうえおかきくけこさしすせそたちつてとなにぬねのはひふへほやゆよらりるれろわをん。</TD> </TR> </TBODY> </TABLE> </BODY> </HTML>