リストの設定

リスト(箇条書き)の設定と記載方法

リスト(箇条書き)を表示します。

リストの種類

<ul> ----- 順序無しリスト(Unorderd List) <ol> ----- 順序リスト(Orderd List)


リストのマークや数値の部分を変更するには <ol>、<ul> に type 属性を指定します。 (下記の表を参照!)


下記、リストタグの説明欄のピンク色の文字は各リストを表示するソースです。
ご使用の際は、コピペしてhtml(ファイル)で保存、Wクリックすると表示できます。

【リストの記載方法と表示結果】
リスト ol、ul の指定方法 実行結果
順序無しリスト(Unorderd List)

順序無しリストを表示するには <ul> を使います。
<ul> <li>donkey <li>donkey <li>donkey </ul>
  • donkey
  • donkey
  • donkey
順序リスト(Orderd List)

順序リストを表示するには <ol> を使います。
<ol> <li>donkey <li>donkey <li>donkey </ol>
  1. donkey
  2. donkey
  3. donkey
type属性の指定方法 (先頭のマーク) 実行結果
type属性の指定

type属性の種類 (先頭のマーク)
  1. 1 --- (数字)
  2. a --- (アルファベット(小))
  3. A ---(アルファベット(大))
  4. i ---(アラビア数字(小))
  5. I ---(アラビア数字(大))
  6. disc ---(黒い丸)
  7. circle ---(白い丸)
  8. square ---(黒い四角)
■ 先頭のマークを消したい場合の指定 ( none )

<ul style="list-style-type: none;"> <li>donkey <li>donkey <li>donkey </ul>

■ type属性を以下のように指定しますと、右の実行結果になります。
リストタグは ul 、 ol どちらでも実行結果は一緒です。

≪type="1"≫ 数字

<ol type="1"> <li>donkey <li>donkey <li>donkey </ol>
≪type="a"≫ アルファベット(小) <ol type="a"> <li>donkey <li>donkey <li>donkey </ol>
≪type="A"≫ アルファベット(大) <ol type="A"> <li>donkey <li>donkey <li>donkey </ol>
≪type="i"≫ アラビア数字(小) <ol type="i"> <li>donkey <li>donkey <li>donkey </ol>
≪type="I"≫ アラビア数字(大) <ol type="I"> <li>donkey <li>donkey <li>donkey </ol>
≪type="disc"≫ 黒い丸 <ol type="disc"> <li>donkey <li>donkey <li>donkey </ol>
≪type="circle"≫ 白い丸 <ol type="circle"> <li>donkey <li>donkey <li>donkey </ol>
≪type="square"≫ 黒い四角 <ol type="square"> <li>donkey <li>donkey <li>donkey </ol>
  • donkey
  • donkey
  • donkey
  1. donkey
  2. donkey
  3. donkey
  1. donkey
  2. donkey
  3. donkey
  1. donkey
  2. donkey
  3. donkey
  1. donkey
  2. donkey
  3. donkey
  1. donkey
  2. donkey
  3. donkey
  1. donkey
  2. donkey
  3. donkey
  1. donkey
  2. donkey
  3. donkey
  1. donkey
  2. donkey
  3. donkey