img~♪ウェブリブログで知ってた方がいいタグ~#3

コメントとかメールとかで色々質問をいただいてしまいました☆
なので、今回は、画像と文字のレイアウトについて、
考えてみたいと思います。

画像とテキストの関係はちょっとややこしい気がします。

たとえば。
ここあ画像

 ここあってば・・・
 最近変な言葉を覚えちゃって(。>_<。)
 なんでこんな句を詠む~???


まあ
左側に画像を寄せちゃうと、文字が画像の右側に回り込んじゃうわけで。

まあ、好みとかケースバイケースで、設定したい位置が違うでしょうから、
参考までに画像と文字の位置関係タグを書いてみました。

ここでは表示しなくなるので全角で書いていますが、
タグ<>は本番では必ず半角で書いてくださいね。


ここあ画像ここあってば・・・
最近変な言葉を覚えちゃって(。>_<。)
なんでこんな句を詠む~???


★ タグ ★
<img src="画像のURL" alt="ここあ画像" border="0" align="left">ここあってば・・・
最近変な言葉を覚えちゃって(。>_<。)
なんでこんな句を詠む~???

※ ブログの場合、位置関係設定がややこしいので、
画像と文字をちょっとだけ離したいときは、
一番上の画像のように【全角スペース】を入れるのもテです☆


ここあ画像あらあら大変・・・位置設定しなかったら
レイアウト崩れちゃったわ
どうしよう・・・?


★ タグ ★
<img src="画像のURL" alt="ここあ画像" border="0">あらあら大変・・・位置設定しなかったら
レイアウト崩れちゃったわ
どうしよう・・・?


ここあ画像どーも。右側画像の文字左側回り込みです。
右側配置はあまり使わないかな?


★ タグ ★
<img src="画像のURL" alt="ここあ画像" border="0" align="right">どーも。右側画像の文字左側回り込みです。
右側配置はあまり使わないかな?

(・・・・・・
右配置はサイドバーが右だから、画像が切れてたらゴメンナサイm(_ _;)m
これも注意点ですね!)


ここあ画像

画像の回り込みカットです。
画像の横に何も書きたくない時に。
★ タグ ★
<img src="画像のURL" alt="ここあ画像" border="0">
<br clear="all">
画像の回り込みカットです。
画像の横に何も書きたくない時に。



ここあ画像HSPACEは
上手く表示しませんね(^.^;)


★ タグ ★
<img src="画像のURL" alt="ここあ画像" border="0" align="left" hspace="50">HSPACEは
上手く表示しませんね(^.^;)


ここあ画像テーブルタグ使用です。
ブログは自動改行なので、タグとタグの間を改行しないでください。
へーんなスペースが空いてしまいますので。
「ここあ」はあんなコト言ってますが、
あきらめないでね!
ここあ画像

★ タグ ★
<table border="0" cellpadding="5"><tr><td><img src=""画像のURL" alt="ここあ画像" border="0"></td><td>テーブルタグ使用です。
ブログは自動改行なので、タグとタグの間を改行しないでください。
へーんなスペースが空いてしまいますので。
「ここあ」はあんなコト言ってますが、
あきらめないでね!</td><td><img src=""画像のURL" alt="ここあ画像" border="0"></td></tr></table>


と、まあ駆け足でながーい記事を書いてしまいましたが、
お役に立てましたでしょうか?
これよりももっと、いい方法がありましたら、教えてくださいね♪

ああ。。。それにしても『ここあ』かわうい・・・(〃▽〃)


★☆★☆★☆★☆★☆★☆★☆★☆★☆★☆★☆★☆★☆★☆

よかったらこちらにもどうぞ♪
オリジナルイラストサイト【柴成館】

★☆★☆★☆★☆★☆★☆★☆★☆★☆★☆★☆★☆★☆★☆


Click Here!

ロリポップ広告

★☆★☆★☆★☆★☆★☆★☆★☆★☆★☆★☆★☆★☆★☆


★☆★☆★☆★☆★☆★☆★☆★☆★☆★☆★☆★☆★☆★☆

ブログをもっと楽しく活用する本―カスタマイズのための基礎知識&カスタマイズのためのHTML・CSS入門

ブログ気持玉

クリックして気持ちを伝えよう!

ログインしてクリックすれば、自分のブログへのリンクが付きます。

→ログインへ

なるほど(納得、参考になった、ヘー)
驚いた
面白い
ナイス
ガッツ(がんばれ!)
かわいい

気持玉数 : 0

この記事へのコメント

2005年04月04日 20:10
柴成さま、コメントありがとうございました♪
色々試してみましたが、全角スペースを使用するのが一番簡単で良かったです。
これからも宜しくお願いしますm(_ _)m
柴成
2005年04月04日 21:35
kanko様、いらっしゃいませ♪
お役に立てて嬉しいです。
また何かありましたらどうぞ。
わかる範囲でお答えしますね(^.^;)

この記事へのトラックバック