第34回その2(文字のまわりこみを防ぐ方法)中級者むけ

まーさ と一緒にお勉強しましょ♪「ブログの使い方」
次は、文字と画像をきれいに掲載する方法を紹介するわね。

複数の画像を掲載する方法(初心者むけ)
  → http://lesson.at.webry.info/200701/article_3.html
文字のまわりこみを防ぐ方法 →→このページをご覧ください。
画像の表示サイズの変更方法(中級者むけ)
  → http://lesson.at.webry.info/200701/article_5.html

・*:・─────────────────────────・:*・
    その2(文字のまわりこみを防ぐ方法)…中級者向け
・*:・─────────────────────────・:*・


まーさ:写真の横に、説明文を入れたいな~っていうときに、
    他の画像や文章と重なったり、一部が表示されなかったり、
    きれいに掲載されないことがあるわね。

    そんなときには、画像を表示するタグの後に<br clear="方向">を
    書き足しておけば、画像の後の文字がまわりこむのを
    防ぐことができるわよ。

    たとえば、画像を左に寄せて、右側に文章を載せる場合には
    画像表示タグの後に、>br clear="left"<と書き足しておけば
    文字のまわりこみを防げるわよ。例えば、こんな感じ↓↓
<a href="https://userdisk.webry.biglobe.ne.jp/004/955/38/1/blog1.jpg" target="_blank"><img src="https://userdisk.webry.biglobe.ne.jp/004/955/38/1/blog1.jpg" width="320" height="240" align="left" class="up-image" alt="画像" title="画像を等倍で表示します" /></a>今日はドライブに行きました。<br clear="left">
<a href="https://userdisk.webry.biglobe.ne.jp/004/955/38/1/blog2.jpg" target="_blank"><img src="https://userdisk.webry.biglobe.ne.jp/004/955/38/1/blog2.jpg" width="320" height="240" align="left" class="up-image" alt="画像" title="画像を等倍で表示します" /></a>少し遠くまで足をのばしてハイキング!歩くのよりも、お弁当がメインかな。<br clear="left">

    実際に表示させてみるわね。
画像今日はドライブに行きました。←ここに<br clear="left">を入れる

画像少し遠くまで足をのばしてハイキング!歩くのよりも、お弁当がメインかな。←ここに<br clear="left">を入れる


   
 Q :右寄せの画像にする場合は、どうすればいいですか?

まーさ:その場合は、<br clear="right">タグを改行したいところに
    書き足してね。

    こんな具合ね。

<img src="画像" width="サイズ" height="サイズ" alt="" align="right"><p>ここの写真の説明文を書いてみてね。<br clear="right">ここから下の文章は画像の下側になっていると思います。

    

 Q :右寄せか左寄せかで、タグの書き方が違うんですね。
    ちょっと難しいなぁ。

まーさ:それなら、どちらの場合でも使えるタグを紹介するわ。
    <br clear="all"> これを書けば、右寄せの場合でも
    左寄せの場合でも、文字は画像の下に来るわよ。
    画像をいくつもタテに並べるときにも、使えるわ。
画像今日はドライブに行きました。
←ここに<br clear="all">を入れる
(ここで、強制的に改行されている)
石狩・十勝・北見の境にある峠なので、「三国峠」といいます。←ここに<br clear="all">を入れる
(ここで、強制的に改行されている)
画像少し遠くまで足をのばして、ハイキング!歩くのよりも、お弁当がメインかな。←ここに<br clear="all">を入れる

(ここで、強制的に改行されている)
   

 Q :<br clear="all">ですね。これなら、覚えられそう。


まーさ:次は、画像サイズの変更方法よ。
     http://lesson.at.webry.info/200701/article_5.html


本「ブログの使い方」でとりあげてもらいたいテーマなどが
ありましたら、このブログにトラックバックもしくはコメントしてくださいね。
みなさまのご意見お待ちしております。

※個別のお問い合わせについては、
  よくある質問と答え(FAQ)をご参照ください。




ブログ気持玉

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

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

→ログインへ

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

気持玉数 : 3

なるほど(納得、参考になった、ヘー) なるほど(納得、参考になった、ヘー)
ナイス

この記事へのコメント

2007年04月15日 21:16
ブログ始めたばっかりで、
分からない事だらけだけど、
勉強になります(^ω^)

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