超初心者でも簡単！あなたもできるHP作成！− Make easily  
||　トップページ　||　HTML　||　Style Sheet　||　リファレンス　||　Web素材　||　Contact Us　||　サイトマップ　||　初めての方　||　
reference
リファレンスの見方 スタイルシートの書き方 ヘッダ情報 ページ全体 見出し 文字（テキスト） リスト テーブル 画像・イメージ リンク レイアウト フォーム フレーム リファレンス一覧


黒丸 白丸 黒四角
数字 大文字のアルファベット 小文字のアルファベット
大文字のローマ数字 小文字のローマ数字 リストの種類を個別に変更する
開始番号の変更 途中で番号を変更する  

リスト

このリファレンスの見方については「リファレンスの見方」をお読みください。
リスト言うのは
  • りんご
  • みかん
  • いちご
このような表示をリストと言います。

リストの種類には大きく「マーク付リスト」と「番号付リスト」があります。

マーク付リスト

【黒丸（標準）】
  • りんご
  • みかん
  • いちご
【HTMLタグ】

<ul>
<li>りんご</li>
<li>みかん</li>
<li>いちご</li>
</ul>

▲このページのトップに戻るTop
【白丸】
  • りんご
  • みかん
  • いちご
【HTMLタグ】

<ul type="circle">
<li>りんご</li>
<li>みかん</li>
<li>いちご</li>
</ul>

【スタイルシート インライン】

<ul style="list-style-type: circle;">
<li>りんご</li>
<li>みかん</li>
<li>いちご</li>
</ul>

【スタイルシートヘッダ、外部ファイル】

ul {
list-style-type: circle;
}

<ul>
<li>りんご</li>
<li>みかん</li>
<li>いちご</li>
</ul>

▲このページのトップに戻るTop
【黒四角】
  • りんご
  • みかん
  • いちご
【HTMLタグ】

<ul type="square">
<li>りんご</li>
<li>みかん</li>
<li>いちご</li>
</ul>

【スタイルシート インライン】

<ul style="list-style-type: square;">
<li>りんご</li>
<li>みかん</li>
<li>いちご</li>
</ul>

【スタイルシートヘッダ、外部ファイル】

ul {
list-style-type: square;
}

<ul>
<li>りんご</li>
<li>みかん</li>
<li>いちご</li>
</ul>

▲このページのトップに戻るTop

番号付リスト

【数字（基本のマーク）】
  1. りんご
  2. みかん
  3. いちご
【HTMLタグ】

<ol>
<li>りんご</li>
<li>みかん</li>
<li>いちご</li>
</ol>

▲このページのトップに戻るTop
【大文字のアルファベット】
  1. りんご
  2. みかん
  3. いちご
【HTMLタグ】

<ol type="A">
<li>りんご</li>
<li>みかん</li>
<li>いちご</li>
</ol>

【スタイルシート インライン】

<ol style="list-style-type: upper-alpha;">
<li>りんご</li>
<li>みかん</li>
<li>いちご</li>
</ol>

【スタイルシートヘッダ、外部ファイル】

ol {
list-style-type: upper-alpha;
}

<ol>
<li>りんご</li>
<li>みかん</li>
<li>いちご</li>
</ol>

▲このページのトップに戻るTop
【小文字のアルファベット】
  1. りんご
  2. みかん
  3. いちご
【HTMLタグ】

<ol type="a">
<li>りんご</li>
<li>みかん</li>
<li>いちご</li>
</ol>

【スタイルシート インライン】

<ol style="list-style-type: lower-alpha;">
<li>りんご</li>
<li>みかん</li>
<li>いちご</li>
</ol>

【スタイルシートヘッダ、外部ファイル】

ol {
list-style-type: lower-alpha;
}

<ol>
<li>りんご</li>
<li>みかん</li>
<li>いちご</li>
</ol>

▲このページのトップに戻るTop
【大文字のローマ数字】
  1. りんご
  2. みかん
  3. いちご
【HTMLタグ】

<ol type="I">
<li>りんご</li>
<li>みかん</li>
<li>いちご</li>
</ol>

【スタイルシート インライン】

<ol style="list-style-type: upper-roman;">
<li>りんご</li>
<li>みかん</li>
<li>いちご</li>
</ol>

【スタイルシートヘッダ、外部ファイル】

ol {
list-style-type: upper-roman;
}

<ol>
<li>りんご</li>
<li>みかん</li>
<li>いちご</li>
</ol>

▲このページのトップに戻るTop
小文字のローマ数字
  1. りんご
  2. みかん
  3. いちご
【HTMLタグ】

<ol type="i">
<li>りんご</li>
<li>みかん</li>
<li>いちご</li>
</ol>

【スタイルシート インライン】

<ol style="list-style-type: lower-roman;">
<li>りんご</li>
<li>みかん</li>
<li>いちご</li>
</ol>

【スタイルシートヘッダ、外部ファイル】

ol {
list-style-type: lower-roman;
}

<ol>
<li>りんご</li>
<li>みかん</li>
<li>いちご</li>
</ol>

▲このページのトップに戻るTop

リストの種類を個別に変更する

【個別に変更する】
  1. りんご
  2. みかん
  3. いちご
  4. パイナップル
  5. キウイ
<ol>
<li>りんご</li>
<li type="A">みかん</li>
<li type="a">いちご</li>
<li type="I">パイナップル</li>
<li type="i">キウイ</li>
</ol>
▲このページのトップに戻るTop

開始番号の変更

開始番号を変える場合は「start="数字"」を使います。
【10から開始する場合】
  1. りんご
  2. みかん
  3. いちご
【HTMLタグ】

<ol start="10">
<li>りんご</li>
<li>みかん</li>
<li>いちご</li>
</ol>

【アルファベットの10番目から開始する場合】
  1. りんご
  2. みかん
  3. いちご
【HTMLタグ】

<ol type="A" start="10">
<li>りんご</li>
<li>みかん</li>
<li>いちご</li>
</ol>

▲このページのトップに戻るTop

途中で番号を変更する

途中で番号を変更する場合は「value="数字"」を使います。
「value="数字"」を挿入したところから、番号が変わります。
【途中から番号を変更する場合】
  1. りんご
  2. みかん
  3. いちご
  4. パイナップル
  5. キウイ
<ol>
<li>りんご</li>
<li>みかん</li>
<li value="8">いちご</li>
<li>パイナップル</li>
<li>キウイ</li>
</ol>
▲このページのトップに戻るTop