■画像を表示するタグに関する補足（暫定版）
「img」タグによく使われる属性のいくつか
<img src="表示するファイル" width="横サイズ" height="縦サイズ" alt="代替テキスト" border="数値"></img>
「width」と「height」は画像の横サイズと縦サイズを指定します。主にピクセルかパーセントが使われているようです。何も指定しない場合はデフォルト（そのまま）のサイズで表示されます。この画像サイズをきちんと書いておくと画面のレイアウトの認識が早いためページの表示も若干速くなるようです。
「alt」には代替テキスト（コメント等）を入れます。画像が表示されない場合に表示されるテキストですがブラウザによっては画像にポインティングデバイスを重ねるとポップアップでコメントが出ます。
「border」は文字通り画像の周囲の囲み線の太さです。表示はブラウザに依存します。「border」を指定しない場合でなおかつリンク等が設定されていない場合は通常不可視になるようです。しかし「border」を指定していない画像にリンク等を設定すると境界が囲まれます。この囲み線を消したい場合は「0」を指定します。またリンク等を設定しない場合で境界線を表示したい場合は値に「0」以上の数値を入れると数値に応じた太さの境界線で囲まれます。
■画像の表示いろいろ：文字列と組み合わせる場合。
と言っても難しいことは無いですね。単に一緒に並べるだけです。
＊「filename.ext」は「ファイル名.拡張子」の意味です（imagefile.jpxのような感じですね）。
そうなのでファイルの後ろに「ext」とつける必要はありません。
＊「filename.html」は「ファイル名.html（htm）」の意味です。
ここには原則として何らかのhtmlファイルが入る形になります。
文字の後ろに画像が出ます。
<p>
文字の後ろに画像が出ます。
<img src="filename.ext">
</p>
画像の後ろに文字が出ます。
<p>
<img src="filename.ext">
画像の後ろに文字が出ます。
</p>
画像を左右の文字で
サンドイッチします。
<p>
画像を左右の文字で
<img src="filename.ext">
サンドイッチします。
</p>
<center>
<p>
<a href="filename.html">
掲示板に戻ります。
<img src="filename.ext">
</a>
</p>
</center>
<center>
<p>
<a href="filename.html">
掲示板に戻ります。
<img src="filename.ext" border="0">
</a>
</p>
</center>
■画像の表示いろいろ：回り込みをもちいた例
<img src="filename.ext" align="left">
<p><a href="filename.html">Index</a></p>
<p><a href="filename.html">Map</a></p>
<p><a href="filename.html">Resume</a></p>
<p><a href="filename.html">Gallery</a></p>
<p><a href="filename.html">Bbs</a></p>
<p><a href="filename.html">Diary</a></p>
<p><a href="filename.html">Link</a></p>
今回は<img>の中で「align="値"」を指定しています。この回り込みを解除したい場合は強制改行タグである<br>に固有の属性を書き加えるのが簡単で一般的な方法です。これらを必要に応じて組み合わせる事により幅広い使い方が可能です。下記を合わせて参照しつついろいろ試してみてください。
<br clear="none"> 初期値。属性無しは同等に解釈されます。
<br clear="left"> 左回りこみ許可を解除します。
<br clear="right"> 右回りこみ許可を解除します。
<br clear="all"> 全ての回りこみ許可を解除します。
| SEO | [PR] 爆速!無料ブログ 無料ホームページ開設 無料ライブ放送 | ||
