箇条書きリストのhtmlタグ <ul><li>
箇条書きにしてリスト化する場合には、<ul><li>のhtmlタグを使います。
まず、リスト化する要素のそれぞれを<li></li>で囲み、さらにそれらを<ul></ul>で囲みます。
【サンプル】：カレーの材料
<ul>
<li>じゃがいも</li>
<li>豚肉</li>
<li>にんじん</li>
<li>たまねぎ</li>
</ul>
このように記述すると、実際にはこのように表示されます。
【実際の表示】
- じゃがいも
- 豚肉
- にんじん
- たまねぎ
この箇条書リストを番号順で記述する場合は、<li>の部分はそのままで、<ul>をの箇所を<ol>に変えるだけです。
【サンプル】：番号付きの箇条書きリスト
<ol>
<li>じゃがいも</li>
<li>豚肉</li>
<li>にんじん</li>
<li>たまねぎ</li>
</ol>
このように記述すると、実際には番号が付いた形で次のように表示されます。
【実際の表示】
- じゃがいも
- 豚肉
- にんじん
- たまねぎ
この箇条書きのタグは、文中のみならず、サイドバーのメニューリストなどでもよく使われます。
フッターで運営者概要などを横に羅列する際には、cssの該当する箇所に display: inline; を記述し、横並びで羅列されるようにするとよいでしょう。
例えば、当サイトのフッターには、運営者情報などを横並びでリスト化していますが、copyrightのdiv要素で囲ったリストタグのスタイルシートはこのような感じで作成しています。
ヘッダーのメニュー部分のナビゲーションバーなども横並びでリスト化することが多いと思いますが、たて・よこの両方で使うことのできる便利なhtmlタグです。