| 【 Ａ 】
|
| a href="リンク先 |
リンクするタグです。
■記述方法 ： <a href="リンク先アドレス">リンク用の文字。</a>
■追加可能 ： target="_blank" （リンク先を新ウィンドウで表示）
■追加可能 ： target="_top" （全フレームがリンク先に移動）
■追加可能 ： title="コメント" （リンク部に矢印を重ねると文字を表示できる）
|
|---|
| a name="リンク先" |
ページ内で指定された場所にリンクするタグです。
■記述方法 ： <a name="名前"></a> （このタグを何処かに書いて場所を指定する）
■記述方法 ： <a href="#名前">リンク用の文字。</a> （名前を付けた場所に行く）
他のページの名前の部分にリンクしたいなら <a href="ページの名前#名前"> とする。
リンクする方は絶対 # （シャープ）を付けてください。
|
|---|
| align="位置" |
横の表示位置を決める記述です。
■位置指定 ： align="left"（左） align="center"（中） align="right"（右）
■記述方法 ： <p align="位置"></p> <div align="位置"></div>
■記述方法 ： <table align="位置"><tr><td></td></tr></table>（全体位置）
■記述方法 ： <table><tr align="位置"><td></td></tr></table>（横一列）
■記述方法 ： <table><tr><td align="位置"></td></tr></table>（中一部）
|
|---|
| alink="色" |
リンク部分を選択中のときの色です。bodyタグ内に書きます。
■記述方法 ： <body alink="色">
|
|---|
| alt="文字" |
画像が表示されてないときや、画像の上に矢印が重なってるときに文字を表示。
■記述方法 ： <img src="画像名" alt="犬の画像です">
|
|---|
| 【 Ｂ 】
|
| b |
文字を太くするタグです。
■記述方法 ： <b>あああ</b>
■サンプル ： あああ
|
|---|
| background="指定" |
サイト全体やtableタグ部分の背景に壁紙を指定できます。
■記述方法 ： <body background="画像">（ホームページ全体）
■記述方法 ： <table background="画像"><tr><td></td></tr></table>（全体）
■記述方法 ： <table><tr background="画像"><td></td></tr></table>（横一列）
■記述方法 ： <table><tr><td background="画像"></td></tr></table>（中一部）
|
|---|
| background-color:指定; |
背景の色を指定することができます。スタイルシートは大体のタグで使用可能。
■記述方法 ： <ここにタグ style="background-color:色指定;">
|
|---|
| background-image:url(指定); |
背景の画像を指定することができます。スタイルシートは大体のタグで使用可能。
■記述方法 ： <ここにタグ style="background-image:url(画像名);">
|
|---|
| bgcolor="色指定" |
サイト全体やtableタグ部分の色の指定をすることができる。
■記述方法 ： <body bgcolor="色指定">
■記述方法 ： <table bgcolor="色指定"><tr><td></td></tr></table>（全体）
■記述方法 ： <table><tr bgcolor="色指定"><td></td></tr></table>（横一列）
■記述方法 ： <table><tr><td bgcolor="色指定"></td></tr></table>（中一部）
|
|---|
| big |
文字を少し大きくするタグです。
■記述方法 ： <big>あああ</big>
■サンプル ： あああ
|
|---|
| body |
ホームページが表示されている全体を表すタグです。
■記述方法 ： <body>ホームページの内容</body>
■追加可能 ： bgcolor="色"（背景色）
■追加可能 ： background="画像"（背景画像）
■追加可能 ： text="色"（全体文字色）
■追加可能 ： link="色"（全体リンク色）
■追加可能 ： vlink="色"（訪問済みのリンク色）
■追加可能 ： alink="色"（選んでいるときのリンク色）
|
|---|
| border="数字" |
tableタグの枠線を表示できます。数字を指定すると太くなる。
■記述方法 ： <table border><tr><td></td></tr></table>
■サンプル ：
■記述方法 ： <table border="5"><tr><td></td></tr></table>
■サンプル ：
|
|---|
| bordercolor="指定" |
tableタグの枠線をの色を決めることができます。「border」も必要です。
■必要な物 ： border
■記述方法 ： <table border bordercolor="色"><tr><td></td></tr></table>
■サンプル ：
■記述方法 ： <table border="5" bordercolor="色"><tr><td></td></tr></table>
■サンプル ：
|
|---|
| border-color:色; |
外線の色を指定することができます。スタイルシートは大体のタグで使用可能。
■必要な物 ： border-style:指定;（線の種類を指定してないと見えません）
■記述方法 ： <ここにタグ style="border-color:色;">
|
|---|
| border-style:指定; |
外線の種類を指定することができます。スタイルシートは大体のタグで使用可能。
■記述方法 ： <ここにタグ style="border-style:指定;">
|
|---|
| border-width:指定; |
外線の太さを指定することができます。スタイルシートは大体のタグで使用可能。
■必要な物 ： border-style:指定;（線の種類を指定してないと見えません）
■記述方法 ： <ここにタグ style="border-style:指定;">
|
|---|
| br |
改行するタグです。他のタグとは違ってタグを閉じる必要がありません。
■記述方法 ： あああ<br>あああ
|
|---|
| 【 Ｃ 】
|
| center |
位置を真ん中に表示するタグです。
■記述方法 ： <center>あああ</center>
■サンプル ： あああ
|
|---|
| cellpadding="数字" |
tableタグの中の文字周りの余白をとることができます。
■記述方法 ： <table cellpadding="数字"><tr><td></td></tr></table>
■サンプル ：
←borderを入れて見えるようにしてます
|
|---|
| cellspacing="数字" |
tableタグの枠の太さを変えることができます。borderや色をつけないと透明。
■記述方法 ： <table cellspacing="数字"><tr><td></td></tr></table>
■サンプル ：
←borderを入れて見えるようにしてます
|
|---|
| color:指定; |
文字の色を変えることができます。スタイルシートは大体のタグで使用可能。
■記述方法 ： <ここにタグ style="color:指定;">
|
|---|
| cols="数字" |
textareaタグの横幅を増やせる。縦を増やすのはrows="数字"
■記述方法 ： <textarea cols="数字">中に表示する文字</textarea>
■サンプル ：
（10と指定すれば半角10文字分の長さになる）
|
|---|
| colspan="数字" |
tableタグの中身を横に結合することができます。※ tdの場所にしか書けません。
■記述方法 ：
<table><tr>
<td colspan="2">あああ</td>
</tr><tr>
<td>あああ</td>
<td>あああ</td>
</tr></table>
■サンプル ：
←指定した数だけ結合できる（今回は2を指定）
|
|---|
| class="指定" |
head内か外部に用意されたスタイルシートを部分的に呼び出すことができます。
■記述方法head部分 ： （AAAの部分に好きな字をいれる。手前にピリオド必要）
<head>
<style type="text/css">
.AAA{font-size:13px;}
.BBB{color:#ff0000;}
</style>
</head>
■記述方法body部分 ： （head内の名前がAAAならclass="AAA"と呼び出す）
<body>
<font class="AAA">ああああ</font>
<b class="AAA">いいいい</b>
<div class="BBB">うううう</div>
</body>
|
|---|
| 【 Ｄ 】
|
dl
dt
dd |
用語とその説明みたいな使い方ができるリストタグです。
■記述方法 ： （dlが全体、dtが手前、ddは手前に余白があく）
<dl>
<dt>あああ</dt>
<dd>いいいいいい</dd>
<dd>いいいいいい</dd>
<dt>あああ</dt>
<dd>いいいいいい</dd>
<dd>いいいいいい</dd>
</dl>
■サンプル ：
- あああ
- いいいいいい
- いいいいいい
- あああ
- いいいいいい
- いいいいいい
|
|---|
| div |
スタイルシートと相性が良いタグ。横1列分使用する。単体では使わない。
■記述方法 ： <div style="スタイルシート">あああ</div>
■記述方法 ： <div align="位置指定">あああ</div> （left左、center中、right右）
|
|---|
| 【 Ｋ 】
|
| 【 Ｌ 】
|
| li |
リストタグの中身の部分のタグです。親タグがulならマーク、olなら数字。
■記述方法 ：
<ul>
<li>あああ</li>
<li>あああ</li>
<li>あああ</li>
</ul>
■サンプル ：
■追加可能： type="種類" disc（黒丸） circle（白丸） square（四角）
■記述方法 ：
<ol>
<li>あああ</li>
<li>あああ</li>
<li>あああ</li>
</ol>
■サンプル ： - あああ
- あああ
- あああ
■追加可能： type="種類" 1（数字） a か A（英字） i か I（ローマ数字）
|
|---|
| line-height:数字; |
文章の上下間の余白を増やせる。スタイルシートは大体のタグで使用可能。
■記述方法 ： <ここにタグ style="line-height:数字;">
|
|---|
| link="色" |
bodyタグ内に書き、全体のリンク色を指定できる。
■記述方法 ： <body link="色">
|
|---|
| 【 Ｍ 】
|
| margin:数字; |
周りの余白を増やすことができる。スタイルシートは大体のタグで使用可能。
■記述方法 ： <ここにタグ style="margin:数字;">
■追加可能 ： margin-top:数字; （上だけ余白をとる）
■追加可能 ： margin-bottom:数字; （下だけ余白をとる）
■追加可能 ： margin-left:数字; （左だけ余白をとる）
■追加可能 ： margin-right:数字; （右だけ余白をとる）
|
|---|
| meta |
検索エンジン用の記述や、サイトの情報関係などに使います。
■記述方法 ：
<meta name="description" content="検索エンジン用の紹介文">
<meta name="keywords" content="検索エンジン用のキーワード,ああ,いい,うう">
その他いろんなメタタグがあります。
|
|---|
| 【 Ｎ 】
|
| 【 Ｏ 】
|
| option |
selectタグの中に記入します。optionが多いほど選択数が増えます。
■記述方法 ：
<select>
<option">１つめ</option>
<option selected">２つめ</option>
<option">３つめ</option>
</select>
■記述方法 ：
option部分にselectedを付けると、そこが最初に選ばれてる状態になります。
|
|---|
| ol |
リストタグの親タグです。<li>タグを増やすごとに数字が変わって行きます。
■記述方法 ：
<ol>
<li>あああ</li>
<li>あああ</li>
<li>あああ</li>
</ol>
■サンプル ： - あああ
- あああ
- あああ
■追加可能： type="種類" 1（数字） a か A（英字） i か I（ローマ数字）
■記述方法 ：
<ol type="A">
<li>あああ</li>
<li>あああ</li>
<li>あああ</li>
</ol>
■サンプル ： - あああ
- あああ
- あああ
|
|---|
| 【 Ｐ 】
|
| p |
段落を変えるタグです。左右中央にすることもできます。
■記述方法 ： <p>あああ</p>
■追加可能 ： align="位置" left（左） center（中） right（右）
|
|---|
| padding:数字; |
文字などの中身の余白を増やせる。スタイルシートは大体のタグで使用可能。
■記述方法 ： <ここにタグ style="padding:数字;">
■追加可能 ： padding-top:数字; （上だけ余白をとる）
■追加可能 ： padding-bottom:数字; （下だけ余白をとる）
■追加可能 ： padding-left:数字; （左だけ余白をとる）
■追加可能 ： padding-right:数字; （右だけ余白をとる）
|
|---|
| 【 Ｑ 】
|
| 【 Ｒ 】
|
| rows="数字" |
textareaタグの縦の段を増やせる。横を増やすのはcols="数字"
■記述方法 ： <textarea rows="数字">中に表示する文字</textarea>
■サンプル ：
（5と指定すれば文字5段分の高さになる）
|
|---|
| rowspan="数字" |
tableタグの中身を縦に結合することができます。※ tdの場所にしか書けません。
■記述方法 ：
<table><tr>
<td rowspan="2">あああ</td>
<td>あああ</td>
</tr><tr>
<td>あああ</td>
</tr></table>
■サンプル ：
←指定した数だけ結合できる（今回は2を指定）
|
|---|
| 【 Ｓ 】
|
| script type="指定" |
Javascriptなどを記述するときに使用します。
|
|---|
| select |
一覧から１つ選べるタグです。主にCGIやJavascriptなどでよく使われます。
選択すると value="内容" の内容の部分の情報をやりとりできます。
■記述方法 ：
<select>
<option value="１つめ">１つめ</option>
<option value="２つめ">２つめ</option>
</select>
■記述方法 ：
|
|---|
| small |
文字を少し小さくするタグです。
■記述方法 ： <small>あああ</small>
■サンプル ： あああ
|
|---|
| strong |
文字を力強くするため、大きく太くするタグです。
■記述方法 ： <strong>あああ</strong>
■サンプル ： あああ
|
|---|
| style="指定" |
スタイルシートを部分的に使用するときに使用します。
|
|---|
| 【 Ｔ 】
|
| table |
表やレイアウトなどに使用できる便利なタグです。borderがないと透明枠になります。
<td>を増やすと横に列が増え、<tr>を増やすと縦に段が増える。
■記述方法 ：
<table border>
<tr>
<td>あああ</td>
<td>あああ</td>
<td>あああ</td>
</tr>
<tr>
<td>あああ</td>
<td>あああ</td>
<td>あああ</td>
</tr>
</table>
■サンプル ：
■追加可能 ： align="位置" left（左） center（中） right（右）
■追加可能 ： cellspacing="数字"（線の太さ） cellpadding="数字"（中の余白）
■追加可能 ： width="数字"（横の長さ） height="数字"（縦の長さ）
■追加可能 ： border="数字"（外枠幅） bordercolor="数字"（枠の色）
■追加可能 ： bgcolor="色"（背景色） background="画像"（背景画像）
|
|---|
| target="指定" |
リンク先の開き方を指定できます。
■記述方法 ： <a href="リンク先" target="指定">あああ</a>
■記述種類 ： target="_blank"（新ウィンドウで開く） target="_top"（フレーム全体）
|
|---|
| td |
tableタグの一番中身のタグです。ここに文字などを記入していきます。
<td>の代わりに<th>を使うこともできます。太字の中央表示になる。
■追加可能 ： align="位置" left（左） center（中） right（右）
■追加可能 ： width="数字"（横の長さ） height="数字"（縦の長さ）
■追加可能 ： bgcolor="色"（背景色） background="画像"（背景画像）
|
|---|
| text="色" |
bodyタグ内に書き、全体の文字の色を決めます。
■記述方法 ： <body text="色">
|
|---|
| textarea |
更新履歴や、掲示板の文章エリアなど幅広く使われています。
中にはテキストだけ記入が可能で、タグは一切使えません。
■記述方法 ： <textarea>中に表示する文字</textarea>
■サンプル ：
■追加可能 ： rows="数字" （縦の段数） cols="数字"（横の長さ）
|
|---|
| text-align:位置; |
文字などの表示位置を指定できる。スタイルシートは大体のタグで使用可能。
■記述方法 ： <ここにタグ style="text-align:位置;">
■位置指定 ： left（左） center（中） right（右）
|
|---|
| text-decoration:指定; |
文字などの上や下に線を付けれる。スタイルシートは大体のタグで使用可能。
■記述方法 ： <ここにタグ text-decoration:指定;">
■記述種類 ： none（下線などを消す） underline（下線） overline（上線）
|
|---|
| th |
<td>と同様のタグです。中央寄せの太字になるので題目に便利。
■追加可能 ： align="位置" left（左） center（中） right（右）
■追加可能 ： width="数字"（横の長さ） height="数字"（縦の長さ）
■追加可能 ： bgcolor="色"（背景色） background="画像"（背景画像）
|
|---|
| title |
ブラウザの左上に表示されるホームページタイトルを決めるタグです。
■記述方法 ： <title>ホームページタイトル</title> （※ headタグ部分に書く）
|
|---|
| title="文字" |
これを記入したタグのエリアの上にマウスで矢印を持っていき、
少し待っていると、中に書かれている文字が表示されます。
■記述方法 ： <a href="http://www.yahoo.co.jp/" title="おすすめ">リンク文字</a>
■サンプル ： リンク文字
■記述方法 ： <b title="太字タグを使ってるよ♪">ここに重ねてみて</b>
■サンプル ： ここに重ねてみて
|
|---|
| tr |
tableタグの縦の段を増やすときに使用するタグ。横一列分の指定もできる。
<tr>タグがないと<td>や<th>は表示できません。
■追加可能 ： align="位置" left（左） center（中） right（右）
■追加可能 ： width="数字"（横の長さ） height="数字"（縦の長さ）
■追加可能 ： bgcolor="色"（背景色） background="画像"（背景画像）
|
|---|
| 【 Ｕ 】
|
| ul |
リストタグの親の部分のタグです。<li>部分が文字を配置します。
■記述方法 ：
<ul>
<li>あああ</li>
<li>あああ</li>
<li>あああ</li>
</ul>
■サンプル ：
■追加可能： type="種類" disc（黒丸） circle（白丸） square（四角）
■記述方法 ：
<ul type="circle">
<li>あああ</li>
<li>あああ</li>
<li>あああ</li>
</ul>
■サンプル ：
|
|---|
| 【 Ｖ 】
|
| valign="位置" |
縦の表示位置を決める記述です。
■位置指定 ： valign="top"（上） valign="bottom"（下）
■記述方法 ： <table><tr valign="位置"><td></td></tr></table>（横一列）
■記述方法 ： <table><tr><td valign="位置"></td></tr></table>（中一部）
|
|---|
| vlink="色" |
bodyタグ内に書き、全体のリンク済みの色を指定できる。
■記述方法 ： <body vlink="色"> （1度行ったことあるリンク先の色）
|
|---|
| 【 Ｗ 】
|
| width="数字" |
tableタグなどの横の長さを数字で指定することができます。tdなどでも使用可能。
■記述方法 ： <table width="数字"><tr><td></td></tr></table> （全体指定）
■記述方法 ： <table><tr><td width="数字"></td></tr></table> （部分指定）
■記述方法 ： <hr width="数字"> （横線の幅指定）
|
|---|
| 【 Ｘ 】
|
| 【 Ｙ 】
|
| 【 Ｚ 】
|
| 【 記号 】
|
| !--コメント-- |
編集する人だけが見えるコメント。ホームページ上では全く見えない。
■記述方法 ： <!--ここに何かメモなど書く-->
自分でメモをしたり、他の人が分かり易いように書いたりするのに使う。
|
|---|
