HOME >> HTML > 複雑なリスト

point 複雑なリスト

<UL><LI>〜</LI></UL>など
リストを作るには、<UL>〜</UL>や<OL>〜</OL>でリスト全体を囲んで、その中に項目分の<LI>〜</LI>を記入しました。そうすれば、シンプルなリストが出来ますが、<UL>〜</UL>の中にさらに<UL>〜</UL>を記入することで2階層のリストを作成することが出来ます。もちろん、<OL>タグも使えます。
サンプル - Microsoft Internet Explorer
ホーム(H)メニュー(M)戻る(B)進む(N)
  • 欲しい物
    • プラズマテレビ
    • 新しい携帯
  • 好きな食べ物
    • ラーメン
    • 肉じゃが
    • 焼肉
ソース
<HTML>
<HEAD>
<TITLE>サンプル</TITLE>
</HEAD>
<BODY>
<UL>
 <LI>欲しい物</LI>
   <ul>
   <li>プラズマテレビ</li>
   <li>新しい携帯</li>
   </ul>
<LI>好きな食べ物</LI>
   <ul>
   <li>ラーメン</li>
   <li>肉じゃが</li>
   <li>焼肉</li>
   </ul>
</UL>
</BODY>
</HTML> 
サンプル - Microsoft Internet Explorer
ホーム(H)メニュー(M)戻る(B)進む(N)
  1. 行って見たい所
    1. タイ
    2. アラスカ
  2. 飼ってみたいペット
    1. パグ
    2. 柴犬
    3. スコティッシュ・フォールド
ソース
<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
ホーム(H)メニュー(M)戻る(B)進む(N)
メニュー
  • ビール
    • 瓶ビール
      • アサヒ
      • キリン
    • 生ビール
  • カクテル
    • モスコミュール
    • カシスソーダ
    • ソルティードック
ソース
<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>
スポンサード・リンク
Copyright ©2001〜2016 まさぼ〜 All Right Reserved