　複雑なリスト

■<ul><li>～</li></ul>など

リストを作るには、<ul>～</ul>や<ol>～</ol>でリスト全体を囲んで、その中に項目分の<li>～</li>を記入しました。そうすれば、シンプルなリストが出来ますが、<ul>～</ul>の中にさらに<ul>～</ul>を記入することで２階層のリストを作成することが出来ます。もちろん、<ol>タグも使えます。

サンプル - Microsoft Internet Explorer

欲しい物

4Kテレビ
嫁さん（笑）

好きな食べ物

ラーメン
うどん
焼肉

HTML

<html>
<head>
<title>サンプル</title>
</head>
<body>
<ul>
 <li>欲しい物</li>
   <ul>
   <li>4Kテレビ</li>
   <li>嫁さん（笑）</li>
   </ul>
<li>好きな食べ物</li>
   <ul>
   <li>ラーメン</li>
   <li>うどん</li>
   <li>焼肉</li>
   </ul>
</ul>
</body>
</html>

サンプル - Microsoft Internet Explorer

行って見たい所

タイ
アラスカ

飼ってみたいペット

パグ
柴犬
チワワ

HTML

<html>
<head>
<title>サンプル</title>
</head>
<body>
<OL TYPE="I">
<li>行って見たい所</li>
   <ol type="a">
   <li>タイ</li>
   <li>アラスカ</li>
   </ol>
<li>飼ってみたいペット</li>
   <ol type="a">
   <li>パグ</li>
   <li>柴犬</li>
   <li>チワワ</li>
   </ol>
</OL>
</body>
</html>

サンプル - Microsoft Internet Explorer

メニュー

ビール

瓶ビール

アサヒ
キリン

生ビール

カクテル

モスコミュール
カシスソーダ
ソルティードック

HTML

<html>
<head>
<title>サンプル</title>
</head>
<body>
メニュー
<ul>
<li>ビール</li>
   <ul>
   <li>瓶ビール</li>
       <ul>
       <li>アサヒ</li>
       <li>キリン</li>
       </ul>
   <li>生ビール</li>
   </ul>
<li>カクテル</li>
   <ul>
   <li>モスコミュール</li>
   <li>カシスソーダ</li>
   <li>ソルティードック</li>
   </ul>
</ul>
</body>
</html>