

このブログを始めた頃、画像の配置が自由に出来ないので嫌だな、と思ってた。そしたら HTML の書き方が少し分ればけっこう簡単に思い通りに出来るのが分った。そこで実際の表示例とそれを実現する HTML を書いてみた。ここでは table タグを使ってるけど他のタグでも同様の事は出来ると思う。
例えば写真の横にこんな風に説明なんかを書いてみたい。
上のようにする手順は以下の通り。
次はこのように写真の下に説明や撮影日を書く例。
上のようにするにはこんな風に HTML を書けばいい。ちなみに HTML の赤い部分のところは1行にまとめないと何故か写真と説明の間が空いてしまう。
例えば写真の横にこんな風に説明なんかを書いてみたい。
![]() |
←この犬は何者? |
上のようにする手順は以下の通り。
- ブログ > 編集画面 > 画像フォルダ 画面で表示したい画像を予めアップロードしておく。
- ブログ > 編集画面 > 画像フォルダ 画面でアップロードしたその画像の URL を取得する。ブラウザが FireFox の場合は画像の上で右クリックして画像のURLをコピーで取得。
- 記事の中に次のような HTML を書く。青い文字のところが取得した画像の URL である。
<table align="center"> <tr> <td> <img src="http://blogimg.goo.ne.jp/user_image/.....41e1b.jpg"> </td> <td> ←この犬は何者? </td> </tr> </table>
次はこのように写真の下に説明や撮影日を書く例。
![]() |
眩しい時はサングラス、文句あっか |
上のようにするにはこんな風に HTML を書けばいい。ちなみに HTML の赤い部分のところは1行にまとめないと何故か写真と説明の間が空いてしまう。
<table align="center"> <tr> <td> <img src="http://blogimg.goo.ne.jp/user_image/.....41e1b.jpg"> </td> </tr> <tr> <td align="center"><font size="-2">眩しい時はサングラス</font></td> </tr> </table>