基本的なタグのみの紹介ですが、とりあえずはコレだけ覚えましょう。
“タグの使える掲示板”等の書込みもできます。

　 　 文字（テキスト）の指定 　　文字のサイズや色、書体を指定します。
タ グ 使 用 例
サ ン プ ル
　“めだか工房”を サイズ2で表示　（標準は3）

　　　<FONT SIZE="2">めだか工房</FONT>
めだか工房
　“めだか工房”を 赤色 で表示　
　　　　 （指定のない場合は黒）

　　　<FONT COLOR="#FF0000">めだか工房</FONT>
めだか工房
　“Medaka”のフォントを “Comic Sans MS” で表示

<FONT FACE="Comic Sans MS">Medaka</FONT>
Medaka
応 用 例

　　<FONT SIZE="4" COLOR="#008000"
　　　FACE="ＭＳ Ｐ明朝">
　　 まとめて指定できます。
　　</FONT>
まとめて
指定できます。


　　画像の表示　 　　画像は一般的にGIFとJPEGを使います。
タ グ 使 用 例
サ ン プ ル

　“kobo_ba.gif”という画像を表示

　　<IMG SRC="http://〜/kobo_ba.gif"
　　 WIDTH="89" HEIGHT="31"　ALT="バナー">

　　　　　　SRCで画像を指定
　　　　　　ALTは画像が表示されない場合のメッセージ
バナー


　　リンクの指定　
タ グ 使 用 例
サ ン プ ル
　“めだか工房”を “http://〜〜” に リンク させる

　　　<A HREF="http://〜〜">めだか工房</A>
　画像を “http://〜〜” に リンク させる

　　　<A HREF="http://〜〜">
　　　 <IMG SRC="kobo_ba.gif" ALT="バナー"
　　　　　 BORDER="0">
　　 </A>
　
　　　　　BORDER="0"を入れると枠が出ません。
バナー


バナー
↑
BORDER="0"ナシ


　　テーブル作成　 　 　（テーブルとは表のことです。）

　　　<TABLE ALIGN="CENTER" WIDTH="60%" BODER="1">
　　　　<TR>
　　　　　<TD ALIGN="LEFT">左の左側(a)</TD>
　　　　　<TD ALIGN="CENTER">中央の(b)中央</TD>
　　　　　<TD ALIGN="RIGHT">右の右側(c)</TD>
　　　　</TR>
　　　　<TR>
　　　　　<TD ALIGN="CENTER" COLSPAN="3">３枠使います(d)</TD>
　　　　</TR>
　　　</TABLE>
　　　　　　
TD1
↓
TD2
↓
TD3
↓
TR1→
　
TR2→
左の左側(a)
中央の中央(b)
右の右側(c)
３枠使います(d)

　　　　　BORDERは枠線の太さの指定、０(ゼロ)にすると枠線は表示されません。
　　　　　　(a)　１列目左枠の中の左側に表示
　　　　　　(b)　２列目中央枠の中の中央に表示
　　　　　　(c)　３列目右枠の中の右側に表示
　　　　　　(d)　２行目の３列分を１枠として表示

　　　 他にこんな指定もできます。

　　　　　<TABLE ALIGN="CENTER" WIDTH="450" BORDER="5"
　　　　　　BORDERCOLOR="#0000FF" >
　　　　　　<TR>
　　　　　　　<TD ALIGN="CENTER" ROWSPAN="2"
　　　　　　　　BGCOLOR="#CCCCFF">
　　　　　　　　縦に２枠使います
　　　　　　　</TD>
　　　　　　　<TD ALIGN="LEFT" VALIGN="TOP"
　　　　　　　　BGCOLOR="#FFFF99">
　　　　　　　　高さがTOP
　　　　　　　</TD>
　　　　　　　<TD ALIGN="CENTER" VALIGN="MIDDLE"
　　　　　　　 BGCOLOR="#CCFFCC">
　　　　　　　　高さがMIDDLE
　　　　　　　</TD>
　　　　　　　<TD ALIGN="RIGHT" VALIGN="BOTTOM"
　　　　　　　 BGCOLOR="#CCFFFF">
　　　　　　　　高さがBOTTOM
　　　　　　　</TD>
　　　　　　</TR>
　　　　　　<TR>
　　　　　　　<TD ALIGN="CENTER" COLSPAN="3" BGCOLOR="#FFCCCC">
　　　　　　　　横に３枠使います
　　　　　　　</TD>
　　　　　　</TR>
　　　　　</TABLE>

縦に２枠
使います
(#CCCCFF)
高さがTOP
(#FFFF99)
MIDDLE
(#CCFFCC)
BOTTOM
(#CCFFFF)
横に３枠使います
(#FFCCCC)


　　その他　

タ グ 使 用 例
表　示
　“めだか工房”を 強調文字（太字） で表示

　　　<B>めだか工房</B>
めだか工房
　“めだか工房”を 斜め文字 で表示

　　　<I>めだか工房</I>
めだか工房
　“めだか工房”を 改行 して表示

　　　めだか<BR>工房
めだか
工房
　“めだか工房”を アンダーライン で強調

　　　<U>めだか工房</U>
めだか工房
　“めだか工房”を 字消し線 で消す

　　　<S>めだか工房</S>
めだか工房


お ま け

・ タグの途中に<BR>が入っても画面には反映されません。
・ 半角のブランク（空白）は反映されませんが、
　全角はブランクとして表示されます。
・ 複数指定をする場合各、指定の間は半角ブランクを入れます。
・ 画像表示やリンク指定の場合パスに注意（下にパスの説明アリ）

ここで使用したタグは、ほんの一部でこれが全てではありません。
基本的な使い方を覚えていただけると何でも使えるようになります。
タグの辞典等が一冊あると何かと便利です。
　



HTMLファイルの中で、リンクの指定や画像を張り付ける場合リンク先や、
画像の置いてある場所を正確に記述しなければ表示できません。

記述方法は「絶対パス」と「相対パス」の２通りがあります。 きちんと理解しましょう

　絶対パス　 (主に他のサイトにあるﾍﾟｰｼﾞやｲﾒｰｼﾞの位置の指定)

　 　　記述例：
　　　　　 http://www.interq.or.jp/medaka/image/medaka_ba.gif

　　　　　　これは、interqというプロバイダのwwwサーバの中の
　　　　　　medakaというディレクトリの中のimageフォルダの中の
　　　　　　medaka_ba.gifという画像を表します。
　　　　　　　（.htmlの指定も同様）

　　　　　自分のページ内の場合でも絶対パスでの記述もOK！ 		　


　相対パス　 (主に自分のホームページ内のﾍﾟｰｼﾞやｲﾒｰｼﾞの位置の指定)

　 　　　現在自分のいるページから見て、表示したい画像や
　　　リンク先がどこにあるのかを表します。

　　記述例：
　　　**　同じフォルダ内に画像がある場合
　　　　　 <IMG SRC="○○.gif" BORDER="0"></IMG>

　　　**　同じフォルダ内のimageフォルダに画像がある場合
　　　　　 <IMG SRC="image/○○.gif" BORDER="0"></IMG>
　　　　　　　　　　　　　　　　　　（.htmlの指定も同様）

　　　　別のフォルダにあるファイルも指定できます。

　　　　../../同位フォルダ名/下位フォルダ名/ファイル名
　　　　../同位フォルダ名/ファイル名
　　　　../同位ファイル名
　




** めだかオススメの一冊 **
なんとなくでもかまわないのですが、決まり事は理解できましたか？
そこまで来たら後は実際に作成してみるのが一番効果的です。
数ある書籍の中で見つけたお勧めの一冊がコレです。

カラーなのでポイントもわかりやすく、色見本としてもGood！
手元に一冊タグ辞典があるととても便利です。

「カラー版　HTMLタグ辞典」 ：アンク著：翔泳社：（1500円）



* Copyight© 1999-2010 めだか工房 *