正しく始めるHTML:多機能追加タグ

Abstruct

今回使うタグまでで、やりたいことが、大体全部出来るようになります

題名を付けるタグ

どんな文章でも、必ず、その文章には題名という物がある物です

そういうタイトルに対して使うタグもあらかじめ用意されています

それがh1タグ


<h1>タイトル</h1>
(以降文章)

ちなみに、h1タグのhは(heading)の頭の文字です

1があるのだから2、3と続いているのか? まぁ、そういうことです(ちなみにh6まである)

ちなみに、規格のルールの問題でh1タグの次は必ずh2タグ次はh3タグを使わなければなりません、番号を飛び飛びに使うのは御法度

リスト系タグ

今回は箇条書きする際等によく使う、リストのを作成するタグulタグとolタグを解説しましょう

この2つのタグの違いは、名前から予想が出来ます、ulとはUnordered List(並列列挙リスト)の略、olとはOrdered List(順序付きリスト)の略です

実際に表示される際には、ulが順序無しリスト、olは順序付きリストとして処理されます

実際に書いてみた場合


<ul>
	<li>ルナサ・プリズムリバー</li>
	<li>メルラン・プリズムリバー</li>
	<li>リリカ・プリズムリバー</li>
</ul>

ulタグサンプル

<ol>
	<li>????</li>
	<li>雛苺</li>
	<li>翠星石</li>
	<li>蒼星石</li>
	<li>真紅</li>
	<li>金糸雀</li>
	<li>水銀灯(未完成)</li>
</ol>

olタグサンプル

こんな感じに表示されます

サンプルを見れば分かりますが、li はList Item(リストの項目)の略、欲しい内容は、ul、olタグの中に直接入れて良いタグはliタグだけです

(ただし、liタグの中にはaだろうがpだろうが、好きなタグ入れて良いですけどね)

ちなみに、リストって言う概念は一般に、よく使うアイテムで、サイトのメニューなんかも、このul、olタグを使って表します

dtタグ

HTMLの使用上は、主に、辞書などを作成する際に、言葉の定義と説明、として使いますが

書式は、ul、olタグに近い物で


<dt>
	<dt>あなたが好きなの</dt>
	<dd>ここまで盛り上げておいてキスの一つもしないなんて・・・。</dd>
	<dt>アミバ</dt>
	<dd>無くても困らないが、あると「あー、やっぱり辞典なんだなぁ」としみじみ実感できる(笑)。</dd>
	<dt>ウサ・ギガンティア</dt>
	<dd>同人誌では、すでにウサ耳は白薔薇のパーツの一つ、となりつつあります(F^^')。</dd>
</dt>

とdlタグの中にdt、ddタグをセットにして書くことになります、各タグは

dt新しく出てきた用語
ddその説明文

となっています

他にも、リンク先とその説明、等で使います。というか、その場合の方が使い道多いのではないでしょうかね…

tableタグ

表を作成する際に、主に使います

書式はこんな感じ


<table>
	<tr><th>表タイトル</th><th>表タイトル</th></tr>
	<tr><td>内容</td><td>内容</td></tr>
	<tr><td>内容</td><td>内容</td></tr>
</table>

表示はこんな感じ

tableタグサンプル

普通はスタイルシートでボーダーを指定しますけど、ここらへんの解説は後回しに

ちなみに、tableタグの中に入るものを解説しておくと、こんな感じ

tr表の区切り
th表のタイトル
td表の内容

他にも"テーブルデザイン"なんて言葉があるくらい、デザインを行う時に利用することのあるタグですが

デザインをするときに様々な理由により、使うことはお勧めされません、特に初心者さんだと

brタグ

brはBreak Line(改行)の略、そもそもは改行のために用意されたタグです

ただ、現在の規格では、改行は主にpタグで行う物になっていて、brタグを使うのは、お勧め出来ません

それでも、なんでコレを付け加えたかというと、brでの改行が望ましい場合もあるから、そしてデザインを行う上で必要になる場面があるから

このタグについては、複数の用途を持っている上に、テクニカルな使い方が多ので、語り出すと終わらないのです

名前だけ覚えておいてください

クリエイティブ・コモンズ・ライセンス

このworkは、クリエイティブ・コモンズ・ライセンスの下でライセンスされています。

Author:babanba-n, Licence:by-sa