ＨＴＭＬ・基礎の基礎・タグ一覧表

いらっしゃいませ(^.^)　

　よくぞこのページまでたどりついてくれました。
日付別にブツブツと切れている表をまとめる際にＨＴＭＬソースで作業をしてみたら、タグを読み取る力がついていることに気がつきました。
ホームページ作成ソフトで離れた表をくっつける方法なんか知らなかったし、助かった！！
「基礎の基礎」の勉強でも意味があることが分かりました(^.^)


1.基本的なHTMLを入力

タグ 読み方 役割 ワンポイント
<html> </html> ｴｲﾁ･ﾃｲｰ･ｴﾑ･ｴﾙ
ｽﾗｯｼｭ　ｴｲﾁ・・・・		 HTMLのルールに従ってファイルが作られていることを示す。 　
<head>　</head> ﾍｯﾀﾞ
ｽﾗｯｼｭ　ﾍｯﾀﾞ		 HTMLの本文以外の情報を入力する。<html>の後に来る。 　
<title> </title> ﾀｲﾄﾙ そのページのタイトル。 ブラウザのタイトルバーに表示される。
<body> </body> ﾎﾞﾃﾞｨ 本文の開始と終了を表す。 この間の内容が、ブラウザのメイン画面に表示される。

2.文字を表示する

タグ 読み方 役割 ワンポイント
<p> </p> ﾋﾞｰ 文章を一つの段落(Paragraph)としてまとめる。 文章のの最後には空白行が挿入され、ひとつのまとまった文章として表示される。
<BR> ﾋﾞｰｱｰﾙ 文字の表示をいったん止めて、次の行の先頭から表示する。 空白行は入らない。
タグを閉じる必要はないので注意。
<P ALIGN> </P> ﾋﾟｰｱﾗｲﾝ 文章を右寄せ・中央寄せにする。 記述例
<P ALIGN="right">文章</P>
<DIV ALIGN>
</DIV>		 ﾃﾞｨﾊﾞｲﾄﾞ ｱﾗｲﾝ 文章を右寄せ・中央寄せにする。 空白行が入らない。
<H1> </H1> ｴｲﾁ 文字を見出しにして文章を階層化する。 　太字になり、設定した文字列の上下に空白行が挿入される。
<B> </B> ﾋﾞｰ 　文字を太字(Bold)にする。 　通常の文字がひとまわり肉厚になる。
<U>　</U> ﾕｰ 　文字に下線をひく。 　underの「U」
<I>　</I> ｱｲ 　文字を斜体にする。 　inclineの「I」？
<FONT>
</FONT>		 ﾌｫﾝﾄ 文章中の一部の文字の色や大きさを変更する。 FONTは印刷用語で活字の型のこと。
<UL> </UL> ﾕｰｴﾙ 　箇条書きにする文章の範囲を決める。 　
<LI> ｴﾙｱｲ 　箇条書きの行頭を表す命令。 　タグを閉じる必要はない。　
<UL　TYPE=""> ﾀｲﾌﾟ 　箇条書きの先頭の記号を指定する。 　FONTにおけるCOLOR、SIZEのようなもの。
<OL> </OL> ｵｰｴﾙ 　箇条書きの先頭を数字にする。 　先頭の数字は1から順番にふられる。
<DL> </DL> ﾃﾞｲｰｴﾙ 箇条書きを記号の代りに用語で始める際の開始と終了。 　
<DT> ﾃﾞｨｰﾃｨｰ 用語・説明の箇条書きにおける用語の先頭を表す。 　<UL>における<LI>にあたる。
<DD> ﾃﾞｲｰﾃﾞｲｰ 用語・説明の箇条書きにおける説明の先頭を表す。 　
<BODY TEXT=""> ﾃｷｽﾄ(オプション) ページ全体の文字の色を指定する。 　
<BODY bgcolor=""> ﾋﾞｰｼﾞｰｶﾗｰ(オプション) ページ全体の背景の色を指定する。 　

3.画像を表示する

タグ 読み方 役割 ワンポイント
　<IMG SRC="ファイル名"> ｲﾒｰｼﾞ･ｿｰｽ　 　ホームページに画像を貼り付ける。　 　IMGはIMAGE、SRCはSOURCEの略。　　
<CENTER> </CENTER>　 ｾﾝﾀｰ　 　文字や画像を水平方向のセンターに表示する。　 　中央に表示したい文字や画像を挿入する命令を挟むような順序で入力。
<DIV ALIGN="right">　</DIV> ﾃﾞｨﾊﾞｲﾄﾞ　ｱﾗｲﾝ・・・ 　　文章・画像を右側に寄せる。 　
<IMG SRC="ファイル名"　ALIGN=
"LEFT">		 ｱﾗｲﾝ=ﾚﾌﾄ 　画像と同じ高さに、２行以上の文章を配置する。　 　　画像と文字の「まわりこみ」と表現される。画像の右に文字を表示したい時は
leftをrightに。
　<IMG SRC="ファイル名" HEIGHT="高さ" WIDTH="幅"> 　 　画像の大きさを指定する。　 　
<IMG SRC="ファイル名"　BORDER="5"> 　ﾎﾞｰﾀﾞｰ 　画像のまわりに枠線をつけて表示する。 　数値を大きくすると枠線は太くなる。
<IMG SRC="ファイル名"　ALIGN="left"　HSPACE="50"> ｴｲﾁｽﾍﾟｲｽ 　画像の左右に隙間を空ける。 　数値はピクセル数。大きくなるほど隙間が広がる。
<IMG SRC="ファイル名"　ALIGN="left"　VSPACE="50"> ﾌﾞｲｽﾍﾟｲｽ 　画像の上下に隙間を空ける。 同上
<BODY BACKGROUND="画像ファイル名"> ﾊﾞｯｸｸﾞﾗｳﾝﾄﾞ 　ページの下地である背景に画像を表示する。 　BGCOLORは色、BACKGROUNDは画像。
<HR> ｴｲﾁｱｰﾙ 　ホームページを横長の線で区切る。 　Horizontal Ruleの略。
<HR WIDTH="400"> 　 　区切り線の長さを指定する。 　
<HR SIZE="5"> 　 　区切り線の太さを指定する。 　
<EMBED SRC="音楽ファイル名　"　AUTOSTART="true"> ｴﾝﾍﾞｯﾄﾞ
ｵｰﾄｽﾀｰﾄ		 　画面を開くと音楽が流れる。 　　
<EMBED SRC="音楽ファイル名　"　AUTOSTART="true"　LOOP="5"> ﾙｰﾌﾟ 　音楽を再生する回数を指定する。 　5のかわりにtrueをいれると連続再生。falseといれると再生しない。
<EMBED SRC="音楽ファイル名　"　AUTOSTART="true"　HIDDEN="true"> ﾋﾄﾞｩﾝ 　音楽再生の目盛り表示を消す。 　

4.リンクを設定する

タグ 読み方 役割 ワンポイント
<A HREF="ファイル名">文字</A> ｴｰ･ｴｲﾁﾚﾌ 　文字列にリンクを設定する。 　リンク命令タグと終了タグにはさまれた文字にリンクが設定される。
<A HREF="ファイル名"><IMG SRC="画像名"></A> 　 　画像にリンクを設定する。 　上記、文字の位置に画像を表示するための命令たぐを入れる。
BORDER="0" ﾎﾞｰﾀﾞｰ 　リンクを設定した画像につく枠を非表示にする。 　画像表示命令タグの中に加える。
<A HREF="#目印名"></A> 　 　同一ページの目印をつけた場所にリンクする。 　ページ内の全ての情報が見えていない場合はジャンプしない。
<A NAME="目印名"> ｴｲ ﾈｲﾑ 　上記目印の名前を付ける。 　
<A HREF="アドレス"></A> 　 　外のホームページにリンクを設定する。 　
<A HREF="画像1"><IMG SRC="画像2"></A> 　 　画像1をクリックすると画像2が表示される。 　小さい写真が並んでいる中から見たいものを選んでクリツクすると大きな写真で見れる、というように使用する。
<BODY LINK="色の名前"> ﾘﾝｸ 　まだ、表示していないリンクの色を指定する命令。 　
<BODY LINK="色の名前"　VLINK="色の名前"> ﾌﾞｲﾘﾝｸ 　訪問済みリンクの色を設定する。 　
<A HREF="mailto:ﾒｰﾙｱﾄﾞﾚｽ">文字</A> ﾒｲﾙ　ﾄｩｰ 　メーソフトを起動させる。 　

5.表を作る

　　
タグ 読み方 役割 ワンポイント
<TABLE BORDER>
</TABLE>		 ﾃｰﾌﾞﾙ　ﾎﾞｰﾀﾞｰ　 　TABLEは表の作成命令。BORDERは枠線を表示。 　BORDERがない場合は枠が表示されない表になる。
<TR> </TR> ﾃｨｰｱｰﾙ 　表の行を表す。 　<TR>と</TR>でくくられた記述が表の１行分の情報。　
<TD> </TD> ﾃｨｰﾃﾞｨｰ 　列を表す。 　<TR>タグにはさまれるように記述しないと、正しくマス目にならない。
<TH> </TH> ﾃｨｰｴｲﾁ 　表の見出し欄を作成する。 　<TD>と同じようにマス目を作成するが、文字は太字で中央に表示される。
<CAPTION> </CAPTION> ｷｬﾌﾟｼｮﾝ 　表の上に表のタイトルを表示する。 　<TABLE>タグの次の行に設定すること。
WIDTH="数値"　HEIGHT="数値" ﾜｲｽﾞ・ﾊｲﾄ 　横幅と高さを指定する。 　<TABLE　BORDER　●>の●の部分に記述する。
WIDTH="数値%"　HEIGHT="数値%" 　 　表の大きさをウィンドウ枠に合わせて変更する。 　数値は％だから、100を超えないように。
<TD ALIGN="位置">　</TD> 　 　文字を左揃え、中央揃え、右揃えに指定する。 　「位置」の部分にleft、center、right。指定しないと左寄せになる。
<TABLE BORDER BGCOLOR="色の名前">　</TABLE> ﾋﾞｰｼﾞｰｶﾗｰ 　表全体に色をつける。 　 色の名前は英語。""で囲むことをわすれないこと。
<TD BGCOLOR="色の名前">　</TD> ﾋﾞｰｼﾞｰｶﾗｰ 　セルに色をつける。 　
<TABLE BORDER="数値">　</TABLE> ﾎﾞｰﾀﾞｰ 　表の外枠の大きさを指定する。 　BORDER=「ふち」「境界」
<TABLE BORDER="数値"　CELSPACING="数値">　</TABLE> ｾﾙｽﾍﾟｲｼﾝｸﾞ 　表の中の枠線の太さを指定する。 　　
<TD COLSPAN="3">文字</TD> ｺﾙｽﾊﾟﾝ 　表の列を結合する。 　結合するセルの数と、表のセルの数が違うと表が崩れて表示されてしまう。
<TD ROWSPAN="3">文字</TD> ﾛｰｽﾊﾟﾝ 　表の行を結合する。 　



　検索などでこのページに直接来た皆様！
上のボタンでＴＯＰページへ行けます。

　ＴＯＰページからたどってこのページに来た方は、
ページを閉じて前のページへお戻り下さいm(__)m