初級篇★ページ作りの基礎知識1. HTMLを書いてみよう VOL1.HTMLを見てみよう ★ 基本のタグ3 ... 見出しとリスト 見出しやリストに関するタグは、スタイル・シート(CSS)を使ってデザインする場合に特によく使われます。作成ソフトで作っていると、あまり馴染みがないかもしれませんが、知識として把握しておきましょう。
正式のHTML文書では、見出しと段落という文書構造を分けて指定することになっています。段落は<p></p>で設定しましたが、見出しは<H1〜6></H>で設定します。ブラウザで表示すると通常は自動的に<H>タグで挟まれた文字が太字になり、下に来る文字との間に空間を空けて表示されます。また、<H1〜6>の数字が大きいほど文字は小さくなりますが、実際の表示は見る側の環境設定に応じて変化する場合がありますので注意が必要です。 なお、スタイルシートを使えば、<H>タグに細かい設定を加えることが可能になりますので、本来の<H>タグの目的である「文書の階層構造を示す」という役割は、スタイルシートを使って初めて正しく機能すると言えるでしょう。<H>タグを使うと文字が大きくなるからといって段落内の文章中で不用意に使うと、意図した通りに表示されないなどの問題が起こることもありえますので、このタグの使用は見出しのみに限っておく方が無難だと思います。
<H1>見出し</H><H2>見出し</H><H3>見出し</H><H4>見出し</H><H5>見出し</H><H6>見出し</H>
1.箇条書きリスト 箇条書きリストを作りたい時に用いるのが<UL></UL>と<OL></OL>です。ULは Unordered List 、OLはOrdered List の略で、ULで指定すれば箇条書きの各項目の行頭には黒丸が、OLで指定すれば各項目の行頭に自動的に連番がふられて表示されます。また、<UL>〜</UL>と<OL>〜</OL>の間には<LI>〜</LI>を並べて、各項目を設定します。ちなみにLIは List Item の略です。具体的には、以下の例を参照して下さい。
なお、行頭の黒丸を他の形にしたり、リスト番号をアルファベットにするなど、細かい点に変更を加えることも出来ますが、この設定はスタイルシートで指定することが望ましいとされていますので、そちらで解説します。
2.定義リスト 用語の定義や解説などをリスト表示する時に使われるのが<DL></DL>で、このタグの間に用語は<DT>〜</DT>、定義(解説)内容は<DD>〜</DD>で挟んで書き込みます。こうして指定すると<DD>〜<DD>で挟まれた内容は、自動的に字下げして表示されます。ちなみに、DLは Definition List、DTは Definition Term、DDは Definition Description の略となっています。具体的には、以下の例を参照して下さい。
<DL> <DT>レーリュッケン型</DT> <DD>凹凸のあるところが鹿の背骨に似ているのでこう呼ばれる。バターをハケで全体にまんべんなく塗り、小麦粉をまぶして使うと焦げつかず、焼きあがったケーキにきれいな凹凸が出来る。</DD> <DT>ブリオーシュ型</DT> <DD>側面に大きなひだのある型で、主にブリオーシュを焼くのに用いる。形が可愛らしいので、ババロアやゼリーを冷やし固める場合にも使われる。</DD> <DT>マドレーヌ型</DT> <DD>貝殻の形をした、マドレーヌ専用の型。一度に6個焼けるものが使いやすいが、小さく焼ける型もある。</DD> </DL> ↓
|
2006.8.17.