WEB相談室

Webページ作成に関しての何でも掲示板です。

タイトル:2つの画像の回り込み

0:[投稿] webweb [2005/12/13 18:35 ] [環境:MacOSX IE5.2 UNIX]

テキストを画像に回り込ませたいのですが、画像を2つ使い、しかも右上と左下に固定することは可能ですか?


1:[回答] あ [2005/12/13 23:44 ]

>画像を2つ使い、しかも

 なんだかいまひとつ分からないが、
右上と左下に固定することは可能。

floteを使えばいい


2:[回答] m035 [2005/12/14 00:36 ][URL]

float

http://www.htmq.com/style/float.shtml


3:[回答] あ [2005/12/14 12:29 ]

ごめん、スペルミスだった ort


4:[回答] webweb [2005/12/14 12:42 ]

floteだと右上と左上に画像を配置することはできるんですが、左下に配置できません。
説明を補足すると、テーブル内に記事(テキスト)があり、そのテーブル内の右上と左下に画像を配置し回り込ませます。そのテキストは定期的に変更する予定で、テキストが短かったり、長かったりする場合でも常に画像はそのテーブルの右上と左下に配置したいのです。


5:[回答] あ [2005/12/14 21:09 ]

テーブルで整形しているなら、
floteなんて使わずに整形できるのでは?

 とりあえず「出せる情報は全て出す」ってことで。
回答者はエスパーじゃないんだから、後出しされてもにんともかんとも。


6:[回答] webweb [2005/12/16 09:12 ]

すいません、情報不足で・・・

テーブルで整形しているなら、
floteなんて使わずに整形できるのでは?

というのは具体的にどのようにやるのか教えていただけますか?


7:[回答] 老衰 [2005/12/16 09:48 ]

■■○
■■■
○■■

こーゆーこと。


8:[回答] xhtml? [2005/12/16 17:02 ]

xhtmlではtableレイアウトはあまり推奨されていないようですが、以前までは(今でもよく利用されている)1px透明gifを支えにしてレイアウトが崩れないようにしていました。
>老衰
の方法でいいのじゃないでしょうか。ボックスレイアウトならfloatを利用すればいいわけですし。


9:[回答] AC1号 [2005/12/16 22:57 ]

floatは、適用した要素が本来(通常フローで)置かれる場所の高さで左or右へ浮動することになる。
http://www.swlab.it.okayama-u.ac.jp/man/rec-css2/visuren.html#q28
ので、テキストの文末近くでfloat:leftを適用したimg要素を置けば、左下に画像があるように見えるはず。

文中にimg要素が入ることになるので、メンテナンス上はあまりよろしくはないが、tableレイアウトという悪夢に比べればかなりマシかと思う。


10:[回答] あ [2005/12/17 00:33 ][URL]

蛇足になりますが

>>6さん
具体的にって、
http://www.kanzaki.com/docs/html/htminfo16.html
な感じで、中央を画像にするだけですけど。

テーブルを使っていると頭に無かったのでfloat使用を勧めました。(テーブルレイアウトは特に嫌悪されると思う。)
フロートで整形なら[URL]みたいな感じで。(ちょっと違いますが)


11:[回答] あ [2005/12/17 02:26 ]

あ、テーブルにそのまま突っ込むとテキストの位置が理想どおりにならないかもなので、その辺りはセルやマージンやパディングで調整すれば良いかと。


12:[回答] 神崎 [2005/12/17 05:46 ]

単に「左側」ならfloatだけでいいのですが、floatだけでは「左下」にはなりません

bottom:0pxなどはposition:absoluteかposition:fixedと併用しなければならないですし、
(親要素がdivにならずに、bodyに対してpositionが決められてしまうようですが)
positionを使うとfloatが無効になるので、
テーブルを使うかAC1号さんのおっしゃるとおり文中の(見た目に左下になりそうな場所に)<img>を入れて、
floatを指定することになると思いますね。

どちらにしても1行の字数やウインドウのサイズによって若干位置がずれてくると思います。


13:[回答] xhtml? [2005/12/17 11:49 ]

この際ですしCSSでごちゃごちゃ設定するのをやめて画像レイアウトを施した画像を背景に設定すれば、テキストの更新に画像が影響されずにすむのでは?


14:[回答] webweb [2005/12/20 16:49 ]

みなさん、たくさんのアドバイスありがとうございます。私の説明の仕方が悪く、やりたいことがなかなか伝わらなかったようで申し訳ありません。
いろいろご意見頂いたのですがテキストを回り込ませる事がしたいので老衰さんやxhtml? のやり方はできません。
AC1号 のやりかたも初めはやっていたのですがこの方法だとテキストを入れ替えたときにその都度画像の位置を調整しないといけないので効率が悪いと思い、相談しました。
古いテキストと新しいテキストを入れ替えるだけで、画像は常に右上と左下になる方法はないでしょうか?


15:[回答] モノ [2005/12/20 16:57 ]

まったく最初から教えて欲しいというわけではないようですので、
webwebさんが記述したソースを提示し、
それのどこがどう希望どおりでないのか書いてみてはどうでしょう。

「テキストを回り込ませたい」がどういう状態を指すのか、
今一曖昧なために回答が出づらいのかもしれません。

回答(必須): 状態:

お名前(必須):

URL:




[戻る]