Search

携帯対応HTML/XHTMLタグリストモジュール

  1. dl〔定義型リスト〕
  2. dt〔定義型リスト（dl要素）の項目〕
  3. dd〔定義型リスト（dl要素）の項目の説明〕
  4. ul〔箇条書きリスト〕
  5. ol〔番号付き順序リスト〕
  6. li〔リスト（ol要素およびul要素）の項目〕
  7. dir※非推奨〔ディレクトリリスト〕
  8. menu※非推奨〔コマンドリスト〕

dl
定義型リスト

2009/11/23

<dl>～</dl>

iモード　[iモード対応HTML Ver1.0] [iモード対応XHTML Ver1.0]
EZweb　［au XHTML］
SoftBank　[SoftBank HTML] [SoftBank XHTML]

dl要素は、定義リストを表すブロック要素です。 dl要素内には、dt要素とdd要素のペアが1組以上出現する必要があります。

サンプル

<dl>
	<dt>項目A</dt>
		<dd>項目Aの内容</dd>
	<dt>項目B</dt>
		<dd>項目Bの内容</dd>
</dl>

dt
定義型リスト（dl要素）の項目

2009/11/23

<dt>～</dt>

iモード　[iモード対応HTML Ver1.0] [iモード対応XHTML Ver1.0]
EZweb　［au XHTML］
SoftBank　[SoftBank HTML] [SoftBank XHTML]

dt要素は、定義リスト（dl要素）の「項目」を表すインライン要素です。

dt要素は、dl要素内に記述します。
dt要素で定義した項目の説明を、dd要素に記述します。
通常、dt要素（項目）とdd要素（項目の説明）はペアで指定します。

注意事項

SoftBank
  • 終了タグ省略可。

dd
定義型リスト（dl要素）の項目の説明

2009/11/23

<dd>～</dd>

iモード　[iモード対応HTML Ver1.0] [iモード対応XHTML Ver1.0]
EZweb　［au XHTML］
SoftBank　[SoftBank HTML] [SoftBank XHTML]

dd要素は、定義リスト（dl要素）の項目の内容を表すインライン要素です。 dd要素は全角1文字分インデントされて表示されます。

注意事項

SoftBank
  • 終了タグ省略可。

ul
箇条書きリスト

2009/11/23

<ul>～</ul>

iモード　[iモード対応HTML Ver1.0] [iモード対応XHTML Ver1.0]
EZweb　［au XHTML］
SoftBank　[SoftBank HTML] [SoftBank XHTML]

ul要素は、箇条書きリストを表すブロック要素です。

ul要素内には、li要素が1回以上出現する必要があります。 リストを入れ子にする場合は、li要素の解した具と終了タグの間に記述するようにしてください。

属性

docomo

ul要素の属性
属性 iモード対応
HTMLバージョン		 iモード対応
XHTMLバージョン		 説明
type="{文字列}" 4.0 - リストマークの種類を指定。
値 説明
disc 黒丸（●）（デフォルト）
circle 白丸（○）
square 四角（■）
style="list-style-type:{文字列};" - 1.0 リストマークの種類をCSSで指定。
値 説明
disc 黒丸（●）（デフォルト）
circle 白丸（○）
square 四角（■）

au

ul要素の属性
属性 XHTML 説明
WAP2.0
type="{文字列}" ○ リストマークの種類を指定。
値 説明
disc 黒丸（●）（デフォルト）
circle 白丸（○）
square 四角（■）
style="list-style-type:{文字列};" ○ リストマークの種類をCSSで指定。
値 説明
disc 黒丸（●）（デフォルト）
circle 白丸（○）
square 四角（■）

SoftBank

ul要素の属性
属性 HTML XHTML 説明
SoftBank
HTML
C2型		 SoftBank
HTML
C3型		 SoftBank
HTML
P型		 SoftBank
HTML
3GC型		 SoftBank
XHTML
3GC型
type="{文字列}" × × △*1 ○ △ リストマークの種類を指定。
値説明
disc黒丸（●）（デフォルト）
circle白丸（○）
square四角（■）
style="list-style-type:{文字列};" × × × ○ ○ リストマークの種類をCSSで指定。
値説明
disc黒丸（●）（デフォルト）
circle白丸（○）
square四角（■）

*1：P4(2)型端末のみ

注意事項

SoftBank
  • ul要素内のli要素は端末のメモリ上限まで記述可。
  • 入れ子は3階層まで。

サンプル

<ul>
    <li>項目1</li>
    <li>項目2</li>
    <li>項目3</li>
</ul>
<br>
<!-- 入れ子 -->
<ul>
    <li>項目1</li>
    <li>項目2
    	<ul>
    		<li>項目2-1</li>
    		<li>項目2-2</li>
    		<li>項目2-3</li>
    	</ul>
    </li>
    <li>項目3</li>
</ul>
<br>
<!-- type属性 -->
<ul type="disc">
    <li>項目1</li>
    <li>項目2</li>
    <li>項目3</li>
</ul>
<br>
<ul type="circle">
    <li>項目1</li>
    <li>項目2</li>
    <li>項目3</li>
</ul>
<br>
<ul type="square">
    <li>項目1</li>
    <li>項目2</li>
    <li>項目3</li>
</ul>
<br>
<!-- CSSのlist-style-typeプロパティ -->
<ul style="list-style-type:disc;">
    <li>項目1</li>
    <li>項目2</li>
    <li>項目3</li>
</ul>
<br>
<ul style="list-style-type:circle;">
    <li>項目1</li>
    <li>項目2</li>
    <li>項目3</li>
</ul>
<br>
<ul style="list-style-type:square;">
    <li>項目1</li>
    <li>項目2</li>
    <li>項目3</li>
</ul>

ol
番号付き順序リスト

2009/11/23

<ol>～</ol>

iモード　[iモード対応HTML Ver1.0] [iモード対応XHTML Ver1.0]
EZweb　［au XHTML］
SoftBank　[SoftBank HTML] [SoftBank XHTML]

ol要素は、番号付きリストを表すブロック要素です。

ol要素内には、li要素が1回以上出現する必要があります。 リストを入れ子にする場合は、li要素の解した具と終了タグの間に記述するようにしてください。

属性

docomo

ol要素の属性
属性 iモード対応
HTMLバージョン		 iモード対応
XHTMLバージョン		 説明
type="{文字列}" 2.0 - リスト番号の種類を指定。
値 説明
1 数字（デフォルト）
A アルファベットの大文字（A～Z）
a アルファベットの小文字（a～z）
※ローマ字の大文字・小文字には対応していません。
style="list-style-type:{文字列};" - 1.0 リスト番号の種類をCSSで指定。
値 説明
decimal 数字（デフォルト）
upper-alpha アルファベットの大文字（A～Z）
lower-alpha アルファベットの小文字（a～z）
start="%Number" 2.0 1.0 リスト番号の開始番号を指定。デフォルトは1。

au

ol要素の属性
属性 XHTML 説明
WAP2.0
type="{文字列}" ○ リスト番号の種類を指定。
値 説明
1 数字（デフォルト）
a アルファベットの小文字（a～z）
A アルファベットの大文字（A～Z）
i ローマ字の小文字（ⅰ,ⅱ,ⅲ...）
I ローマ字の大文字（Ⅰ,Ⅱ,Ⅲ...）
style="list-style-type:{文字列};" ○ リスト番号の種類をCSSで指定。
値 説明
decimal 数字（デフォルト）
lower-alpha アルファベットの小文字（a～z）
upper-alpha アルファベットの大文字（A～Z）
lower-roman ローマ字の小文字（ⅰ,ⅱ,ⅲ...）
upper-roman ローマ字の大文字（Ⅰ,Ⅱ,Ⅲ...）
start="%Number" ○ リスト番号の開始番号を指定。デフォルトは1。

*1：P4(2)型のみ

SoftBank

ol要素の属性
属性 HTML XHTML 説明
SoftBank
HTML
C2型		 SoftBank
HTML
C3型		 SoftBank
HTML
P型		 SoftBank
HTML
3GC型		 SoftBank
XHTML
3GC型
type="{文字列}" × × △*1 △ △ リスト番号の種類を指定。
値 説明
1 数字（デフォルト）
a アルファベットの小文字（a～z）
A アルファベットの大文字（A～Z）
i ローマ字の小文字（ⅰ,ⅱ,ⅲ...）
I ローマ字の大文字（Ⅰ,Ⅱ,Ⅲ...）
style="list-style-type:{文字列};" × × × × ○ リスト番号の種類をCSSで指定。
値 説明
decimal 数字（デフォルト）
upper-alpha アルファベットの大文字（A～Z）
lower-alpha アルファベットの小文字（a～z）
lower-roman ローマ字の小文字（ⅰ,ⅱ,ⅲ...）
upper-roman ローマ字の大文字（Ⅰ,Ⅱ,Ⅲ...）
start="%Number" × × △*1 ○ ○ リスト番号の開始番号を指定。デフォルトは1。

*1：P4(2)型のみ

注意事項

SoftBank
  • ol要素内のli要素は99個まで。
  • 入れ子は3階層まで。

サンプル

■HTML 
<ol>
    <li>項目1</li>
    <li>項目2</li>
    <li>項目3</li>
</ol>
<br>
<!-- 入れ子 -->
<ol>
    <li>項目1</li>
    <li>項目2
    	<ol>
    		<li>項目2-1</li>
    		<li>項目2-2</li>
    		<li>項目2-3</li>
    	</ol>
    </li>
    <li>項目3</li>
</ol>
<br>
<!-- type属性 -->
<ol type="1" start="10">
    <li>項目1</li>
    <li>項目2</li>
    <li>項目3</li>
</ol>
<br>
<ol type="a">
    <li>項目1</li>
    <li>項目2</li>
    <li>項目3</li>
</ol>
<br>
<ol type="A">
    <li>項目1</li>
    <li>項目2</li>
    <li>項目3</li>
</ol>
<br>
<ol type="i">
    <li>項目1</li>
    <li>項目2</li>
    <li>項目3</li>
</ol>
<br>
<ol type="I">
    <li>項目1</li>
    <li>項目2</li>
    <li>項目3</li>
</ol>
<br>
<!-- CSSのlist-style-typeプロパティ -->
<ol style="list-style-type:decimal;" start="10">
    <li>項目1</li>
    <li>項目2</li>
    <li>項目3</li>
</ol>
<br>
<ol style="list-style-type:lower-roman" start="10">
    <li>項目1</li>
    <li>項目2</li>
    <li>項目3</li>
</ol>
<br>
<ol style="list-style-type:upper-roman" start="20">
    <li>項目1</li>
    <li>項目2</li>
    <li>項目3</li>
</ol>
<br>
<ol style="list-style-type:lower-alpha" start="24">
    <li>項目1</li>
    <li>項目2</li>
    <li>項目3</li>
</ol>
<br>
<ol style="list-style-type:upper-alpha" start="24">
    <li>項目1</li>
    <li>項目2</li>
    <li>項目3</li>
</ol>
■XHTML

li
リスト（ol要素およびul要素）の項目

2009/11/23

<li>～</li>

iモード　[iモード対応HTML Ver1.0] [iモード対応XHTML Ver1.0]
EZweb　［au XHTML］
SoftBank　[SoftBank HTML] [SoftBank XHTML]

li要素は、リストの項目を表すインライン要素です。 li要素は、ol要素またはul要素内に記述します。 インデント量は端末によって異なります。

属性

docomo

li要素の属性
属性 iモード対応
HTMLバージョン		 iモード対応
XHTMLバージョン		 説明
value="%Number" 2.0 1.0 項目の順番を指定。
※ol要素のli要素の場合のみ指定可。
type="{文字列}" 2.0 - リスト番号の種類を指定。
値 説明
1 数字
A アルファベットの大文字（A～Z）
a アルファベットの小文字（a～z）
※ローマ字の大文字・小文字には対応していません。
type="{文字列}" 4.0 - リストマークの種類を指定。
値 説明
disc 黒丸（●）（デフォルト）
circle 白丸（○）
square 四角（■）
style="list-style-type:{文字列};" - 1.0 リスト番号およびリストマークをCSSで指定。
値 説明
decimal 数字
upper-alpha アルファベットの大文字（A～Z）
lower-alpha アルファベットの小文字（a～z）
disc 黒丸（●）（デフォルト）
circle 白丸（○）
square 四角（■）

au

li要素の属性
属性 XHTML 説明
WAP2.0
value="%Number" ○ 項目の順番を指定。
※ol要素のli要素の場合のみ指定可。
type="{文字列}" ○ リスト番号およびリストマークを指定。
値 説明
1 数字（ol要素内にあるli要素のデフォルト）
A アルファベットの大文字（A～Z）
a アルファベットの小文字（a～z）
i ローマ字の小文字（ⅰ,ⅱ,ⅲ...）
I ローマ字の大文字（Ⅰ,Ⅱ,Ⅲ...）
disc 黒丸（●）（ul要素内にあるli要素のデフォルト）
circle 白丸（○）
square 四角（■）
style="list-style-type:{文字列};" ○ リスト番号およびリストマークをCSSで指定。
値 説明
decimal 数字
lower-alpha アルファベットの小文字（a～z）
upper-alpha アルファベットの大文字（A～Z）
lower-roman ローマ字の小文字（ⅰ,ⅱ,ⅲ...）
upper-roman ローマ字の大文字（Ⅰ,Ⅱ,Ⅲ...）
disc 黒丸（●）（デフォルト）
circle 白丸（○）
square 四角（■）

SoftBank

li要素の属性
属性 HTML XHTML 説明
SoftBank
HTML
C2型		 SoftBank
HTML
C3型		 SoftBank
HTML
P型		 SoftBank
HTML
3GC型		 SoftBank
XHTML
3GC型
value="%Number" × × △*1 ○ △ 項目の順番を指定。
※ol要素のli要素の場合のみ指定可。
type="{文字列}" × × △*1 △ △ リスト番号およびリストマークを指定。
値 説明
1 数字（ol要素内にあるli要素のデフォルト）
A アルファベットの大文字（A～Z）
a アルファベットの小文字（a～z）
I ローマ字の大文字（Ⅰ,Ⅱ,Ⅲ...）
i ローマ字の小文字（ⅰ,ⅱ,ⅲ...）
disc 黒丸（●）（ul要素内にあるli要素のデフォルト）
circle 白丸（○）
square 四角（■）
style="list-style-type:{文字列};" × × × × ○ リスト番号およびリストマークをCSSで指定。
値 説明
decimal 数字
lower-alpha アルファベットの小文字（a～z）
upper-alpha アルファベットの大文字（A～Z）
lower-roman ローマ字の小文字（ⅰ,ⅱ,ⅲ...）
upper-roman ローマ字の大文字（Ⅰ,Ⅱ,Ⅲ...）
disc 黒丸（●）（デフォルト）
circle 白丸（○）
square 四角（■）

サンプル

<!-- type属性 -->
<ul>
  <li type="disc">disc</li>
  <li type="circle">circle</li>
  <li type="square">square</li>
</ul>
<br>
<ol>
  <li type="1">番号</li>
  <li type="a">ｱﾙﾌｧﾍﾞｯﾄの小文字</li>
  <li type="A">ｱﾙﾌｧﾍﾞｯﾄの大文字</li>
  <li type="i">ﾛｰﾏ字の小文字</li>
  <li type="I">ﾛｰﾏ字の大文字</li>
</ol>
<br>
<!-- CSSのlist-style-typeプロパティ -->
<ul>
    <li style="list-style-type:disc;">list-style-type:disc;</li>
    <li style="list-style-type:square;">list-style-type:square;</li>
    <li style="list-style-type:circle;">list-style-type:circle;</li>
</ul>
<br>
<ol>
    <li style="list-style-type:decimal;">list-style-type:decimal;</li>
    <li style="list-style-type:upper-alpha;">list-style-type:upper-alpha;</li>
    <li style="list-style-type:lower-alpha;">list-style-type:lower-alpha;</li>
    <li style="list-style-type:upper-roman;">list-style-type:upper-roman;</li>
    <li style="list-style-type:lower-roman;">list-style-type:lower-roman;</li>
</ol>

dir※非推奨
ディレクトリリスト

2009/11/23

<dir>～</dir>

iモード　[iモード対応HTML Ver1.0]
EZweb　［au XHTML］
SoftBank　[SoftBank HTML] [SoftBank XHTML]

dir要素は、ディレクトリのように複数の段組み形式で表示される番号なしリストを表します。 ブラウザではul要素（箇条書きリスト）と同様の動作をします。

※XHTMLではul要素で代替しましょう。
※非推奨要素でありメジャーなタグではないので、HTMLでもul要素を使用しましょう。

属性

docomo

dir要素の属性
属性 iモード対応
HTMLバージョン		 iモード対応
XHTMLバージョン		 説明
type="{文字列}" 4.0 - リストマークの種類を指定。
値 説明
disc 黒丸（●）（デフォルト）
circle 白丸（○）
square 四角（■）

au

dir要素の属性
属性 XHTML 説明
WAP2.0
type="{文字列}" ○ リストマークの種類を指定。
値 説明
disc 黒丸（●）（デフォルト）
circle 白丸（○）
square 四角（■）

SoftBank

dir要素の属性
属性 HTML XHTML 説明
SoftBank
HTML
C2型		 SoftBank
HTML
C3型		 SoftBank
HTML
P型		 SoftBank
HTML
3GC型		 SoftBank
XHTML
3GC型
type="{文字列}" × × △*1 △ △ リストマークの種類を指定。
値 説明
disc 黒丸（●）（デフォルト）
circle 白丸（○）
square 四角（■）

*1：P4(2)型端末のみ

サンプル

■HTML 
<dir>
    <li>項目1</li>
    <li>項目2</li>
    <li>項目3</li>
</dir>
<br>
<!-- 入れ子 -->
<dir>
    <li>項目1</li>
    <li>項目2
    	<dir>
    		<li>項目2-1</li>
    		<li>項目2-2</li>
    		<li>項目2-3</li>
    	</dir>
    </li>
    <li>項目3</li>
</dir>
<br>
<!-- type属性 -->
<dir type="disc">
    <li>項目1</li>
    <li>項目2</li>
    <li>項目3</li>
</dir>
<br>
<dir type="circle">
    <li>項目1</li>
    <li>項目2</li>
    <li>項目3</li>
</dir>
<br>
<dir type="square">
    <li>項目1</li>
    <li>項目2</li>
    <li>項目3</li>
</dir>
<br>
<!-- CSSのlist-style-typeプロパティ -->
<dir style="list-style-type:disc;">
    <li>項目1</li>
    <li>項目2</li>
    <li>項目3</li>
</dir>
<br>
<dir style="list-style-type:circle;">
    <li>項目1</li>
    <li>項目2</li>
    <li>項目3</li>
</dir>
<br>
<dir style="list-style-type:square;">
    <li>項目1</li>
    <li>項目2</li>
    <li>項目3</li>
</dir>

menu※非推奨
コマンドリスト

2009/11/23

<menu>～</menu>

iモード　[iモード対応HTML Ver1.0]
EZweb　［au XHTML］
SoftBank　[SoftBank HTML] [SoftBank XHTML]

menu要素は、メニューのように各項目が比較的短いものに対して使用する番号なしリストを表すブロック要素です。 ブラウザではul要素（箇条書きリスト）と同様の動作をします。

※XHTMLではul要素で代替しましょう。
※非推奨要素でありメジャーなタグではないので、HTMLでもul要素を使用しましょう。

属性

docomo

menu要素の属性
属性 iモード対応
HTMLバージョン		 iモード対応
XHTMLバージョン		 説明
type="{文字列}" 4.0 - リストマークの種類を指定。
値 説明
disc 黒丸（●）（デフォルト）
circle 白丸（○）
square 四角（■）

au

menu要素の属性
属性 XHTML 説明
WAP2.0
type="{文字列}" ○ リストマークの種類を指定。
値 説明
disc 黒丸（●）（デフォルト）
circle 白丸（○）
square 四角（■）

SoftBank

menu要素の属性
属性 HTML XHTML 説明
SoftBank
HTML
C2型		 SoftBank
HTML
C3型		 SoftBank
HTML
P型		 SoftBank
HTML
3GC型		 SoftBank
XHTML
3GC型
type="{文字列}" × × △*1 △ △ リストマークの種類を指定。
値 説明
disc 黒丸（●）（デフォルト）
circle 白丸（○）
square 四角（■）

*1：P4(2)型端末のみ

サンプル

■HTML 
<menu>
    <li>項目1</li>
    <li>項目2</li>
    <li>項目3</li>
</menu>
<br>
<!-- 入れ子 -->
<menu>
    <li>項目1</li>
    <li>項目2
    	<menu>
    		<li>項目2-1</li>
    		<li>項目2-2</li>
    		<li>項目2-3</li>
    	</menu>
    </li>
    <li>項目3</li>
</menu>
<br>
<!-- type属性 -->
<menu type="disc">
    <li>項目1</li>
    <li>項目2</li>
    <li>項目3</li>
</menu>
<br>
<menu type="circle">
    <li>項目1</li>
    <li>項目2</li>
    <li>項目3</li>
</menu>
<br>
<menu type="square">
    <li>項目1</li>
    <li>項目2</li>
    <li>項目3</li>
</menu>
<br>
<!-- CSSのlist-style-typeプロパティ -->
<menu style="list-style-type:disc;">
    <li>項目1</li>
    <li>項目2</li>
    <li>項目3</li>
</menu>
<br>
<menu style="list-style-type:circle;">
    <li>項目1</li>
    <li>項目2</li>
    <li>項目3</li>
</menu>
<br>
<menu style="list-style-type:square;">
    <li>項目1</li>
    <li>項目2</li>
    <li>項目3</li>
</menu>

関連コンテンツ

Q. このサイトの情報はお役に立ちましたでしょうか？

投票する 投票結果を見る

管理人に【web拍手】を送るweb拍手（1行メッセージも送れます♪）

TOP / ご利用上の注意点 / リンクについて / RSS

Valid: HTML検証, CSS検証, RSS検証

Thanks: Material Design 420 free icons

©2024 PHP & JavaScript Room All Rights Reserved.

pagetop

polarized women