ランキングに参加し始めました。ポチッと宜しくお願いしますw
写真ギャラリー
カテゴリーアーカイブ

2017年12月17日

ファンブログ備忘録(3)画像の左右に文字表示


ファンブログ備忘録(3)として記録しときます

画像の左右に文字を表示させる方法を調べてみました
1.align
?@ align="(top|middle|bottom|left|right)" 文字との位置関係
<img src="/??????.JPG" border="0" alt="??????.JPG" align="(top|middle|bottom|left|right)">
・top
 img上部と文字一行を揃えて表示
・ middle
 img中央と文字一行を揃えて表示
・bottom (初期値)
 img下部と文字一行を揃えて表示
・left
 左にimgを浮動、右に文字を回り込み表示
・right
 右にimgを浮動、左に文字を回り込み表示
?Abr >clear clear="(left|all|right|none)" 回り込みの解除
clearは、イメージなどの回り込み文字を解除するのに用います。たとえば、<img align="(left | right)">のとき、それぞれ、clear="(left | right)"を用いて解除します。両方の回り込みを同時に解除するときには、clear="all"を用います。初期値(default)は、clear="none"です。
・clear="left"
<img align="left">のとき、普通に改行をすると(<br>)
回り込み内での改行となります。(<br>)
これを解除するのには、<br clear="left">を用います。(<br clear="left">)
・clear="right"
<img align="right">のとき、普通に改行をすると
回り込み内での改行となります。
これを解除するのには、<br clear="right">を用います。
2.style
?@ style="(none|left|right)" 文字との位置関係
<img src="/??????.JPG" border="0" alt="??????.JPG" style="(none|left|right)">
・none
 画像の表示位置は指定しません。(デフォルト)
・left
 左にimgを浮動、右に文字を回り込み表示
・right
 右にimgを浮動、左に文字を回り込み表示
?Aclear clear="clear:both;" 回り込みの解除
clearは、イメージなどの回り込み文字を解除するのに用います。
<br style="clear:both;">
文字の回り込みが解除され画像の下の行にきます








この記事へのコメント
コメントを書く

お名前: 必須項目

メールアドレス:


ホームページアドレス:

コメント: 必須項目

※ブログオーナーが承認したコメントのみ表示されます。

Build a Mobile Site
スマートフォン版を閲覧 | PC版を閲覧
Share by: