画像のキャプションと配置について [ちょっと便利なhtml記述]

メイン.jpg
画像に説明文(キャプション)を付けたいことが良くあります。

おすすめのアルバムが表示 有名どころが並んでいます
htmlには,図のキャプション用に<figurecaption>というタグが用意されていて便利ですが,右よせ左よせと共存出来ない?様ですし,複数の図に一つのキャプションをつけるとか,いろいろ自由にやろうとすると<table>でやるのが一番なようです。

表に,図やキャプションを入れて配置するということです。枠線を消してしまえばきれいに表示されます。マージン調整などもいくらでも細かく出来ますので,調整しておいて気に入った配置のものをテンプレート的に使えば良いでしょう。ちなみに右上の図は,<table>でやったもので,そのソースは以下のようになっています。

<table border="0" cellpadding="0" cellspacing="0" align="right">
<tr>
  <td> </td>
  <td><img src="https://farm1.staticflickr.com/279/18993785114_c4ff8edae8_m.jpg"></td>
  <td> </td>
  <td><img src="https://farm1.staticflickr.com/440/19428381160_51c44d050e_m.jpg">
</td>
</tr>
<tr>
  <td> </td>
  <td><span style="font-size:x-small;">おすすめのアルバムが表示</span></td>
  <td> </td>
  <td><span style="font-size:x-small;">有名どころが並んでいます</span></td>
</tr>
</table>

nice!(12)  コメント(0)  トラックバック(1) 
共通テーマ:PLAYLOG

nice! 12

コメント 0

コメントを書く

お名前:
URL:
コメント:
画像認証:
下の画像に表示されている文字を入力してください。

トラックバック 1

この広告は前回の更新から一定期間経過したブログに表示されています。更新すると自動で解除されます。