Help:箇条書き
[Wikipedia|▼Menu]
.mw-parser-output .module-shortcutboxplain{float:right;border:1px solid #aaa;background:#fff;margin:0 0 0 1em;padding:0.3em 0.6em 0.2em 0.6em;text-align:center;font-size:85%;font-weight:bold}.mw-parser-output .module-shortcutlist{display:inline-block;border-bottom:1px solid #aaa;margin-bottom:0.2em;font-weight:normal}.mw-parser-output .module-shortcutanchordiv{position:relative;top:-3em}ショートカット:

H:LIST


ようこそ

ガイドブック

チュートリアル

早見表

用語集

FAQ

ヘルプ

利用案内

質問

ウィキペディア日本語版のヘルプページです。

編集用ヘルプ目次
編集の基本
ページの編集
新規ページの作成
記事名チェック
文書の体裁
セクションと目次
箇条書き / 表の作り方
脚注 / ISBNのリンク
特殊文字
HTMLタグの使用
画像の表示
画像などの利用
ファイルページ
数式の書き方
リンクする
リンク / URL
パイプ付きリンク
言語間・ウィキ間リンク
ウィキデータ
カテゴリ
リダイレクトソフト
ページの位置づけ
名前空間
サブページ
ミスなどの修正
新規ページの巡回
以前の版にページを戻す方法
ページの移動
作業の効率化
マジックワード
テンプレート早わかり
テンプレートの制限
条件文 / テンプレートの説明文
ナビゲーションボックス
コミュニケーション
要約欄
細部の編集
ノートページ / 過去ログ
ウィキラブ
ウィキメール / 感謝
その他
編集の競合
ページ名の働き
記事の定義
ページサイズ
音声・動画の作成と利用
棒グラフの書き方
サンドボックス
ウィキポータル

箇条書きの正しいマークアップについて説明しています。Help:ページの編集#箇条書きにて説明されているように、点を振っていく通常の箇条書きのほか、番号つき箇条書きは順番や数を示すことができ、定義の箇条書きは用語とその説明を簡単に列挙するのに便利です。これらの箇条書きを組み合わせるとき、一見ちゃんと表示されていても、箇条書きの階層が不正確となる場合があります。推奨される例、そうでない例を挙げて箇条書きのマークアップ方法を解説します。

ウィキペディアのマークアップを使って書いた記事は、表示の際に HTML に変換されます。このとき、マークアップのやり方によっては HTML が望ましい形で作られないということです。
推奨される例
定義の箇条書き

もし作ろうとしているのが、短い単語(用語や人名など)とそれに対する説明の組み合わせによるリストなら、すべて定義の箇条書きにするのが理にかなっています。特に、「登場人物とその解説」などは定義の箇条書きによって記述されるのが望ましい典型的なケースです。

表示結果入力内容HTMLイメージ

用語1
用語1の説明
用語2
用語2の説明; 用語1?: 用語1の説明; 用語2?: 用語2の説明<dl> <dt>用語1</dt> <dd>用語1の説明</dd> <dt>用語2</dt> <dd>用語2の説明</dd></dl>dldt 用語1dd 用語1の説明dt 用語2dd 用語2の説明

定義の箇条書きで作られたひとつのブロック(<dl>...</dl>)の中に、用語(<dt>...</dt>)とその定義(<dd>...</dd>)がペアで現れています。これは推奨される書き方です。
箇条書き

説明文の入らない単純なものであれば、ふつうの箇条書きを使うのが望ましいでしょう。また、順序を強調したいものであれば順序つき箇条書き(番号つき箇条書き)を使うと視覚的ブラウザで見たときに順序を表す番号が付けられます。

表示結果入力内容HTMLイメージ


foo

bar


hoge

fuga

piyo

* foo** bar* hoge** fuga** piyo<ul> <li>foo <ul> <li>bar</li> </ul> </li> <li>hoge <ul> <li>fuga</li> <li>piyo</li> </ul> </li></ul>ulli fooulli barli hogeulli fugali piyo

foo
bar


hoge
fuga

piyo

# foo## bar# hoge## fuga## piyo<ol> <li>foo <ol> <li>bar</li> </ol> </li> <li>hoge <ol> <li>fuga</li> <li>piyo</li> </ol> </li></ol>olli fooolli barli hogeolli fugali piyo

あまり良くない例
違う種類のマークアップによる分断

表示結果入力内容HTMLイメージ


用語1
用語1の説明

用語2
用語2の説明* 用語1: 用語1の説明* 用語2: 用語2の説明<ul> <li>用語1</li></ul><dl> <dd>用語1の説明</dd></dl><ul> <li>用語2</li></ul><dl> <dd>用語2の説明</dd></dl>ulli 用語1dldd 用語1の説明ulli 用語2dldd 用語2の説明

このように、箇条書きで作られたブロック(<ul>...</ul>)と、定義の箇条書きで作られたブロック(<dl>...</dl>)が交互に現れ、ブロックが分断されてしまっています。
定義の入れ子

上の例よりもちょっとはましな例です。

表示結果入力内容HTMLイメージ


用語1用語1の説明

用語2用語2の説明
* 用語1*: 用語1の説明* 用語2*: 用語2の説明<ul> <li>用語1 <dl> <dd>用語1の説明</dd> </dl> </li> <li>用語2 <dl> <dd>用語2の説明</dd> </dl> </li></ul>ulli 用語1dldd 用語1の説明li 用語2dldd 用語2の説明

箇条書きのブロック(<ul>...</ul>)はひとつになったものの、箇条書きの各要素(<li>...</li>)の中にいちいち定義の箇条書きのブロック(<dl>...</dl>)が発生してしまいます。また、<dl>...</dl>の中には普通、用語(<dt>...</dt>)とその定義(<dd>...</dd>)がペアで存在するのが望ましいのですが、<dd>...</dd>だけが出現していて<dl>...</dl>の使い方としてはあまり良くありません。
空行の挿入

せっかく定義の箇条書きを使っても意味がなくなってしまうことがあります。

表示結果入力内容HTMLイメージ

用語1
用語1の説明
用語2
用語2の説明; 用語1?: 用語1の説明; 用語2?: 用語2の説明

(用語1の行と用語2の行との間に、改行のみの空行を一行はさんでいる)<dl> <dt>用語1</dt> <dd>用語1の説明</dd></dl><dl> <dt>用語2</dt> <dd>用語2の説明</dd></dl>dldt 用語1dd 用語1の説明dldt 用語2dd 用語2の説明

間に空行(何も書かれていない、改行だけの行)を入れてしまったばかりに、定義の箇条書きで作られるブロックがふたつに分かれてしまいました。このような編集は、編集段階で見やすくするために行われることがありますが、残念ながら逆効果です。

表示結果入力内容HTMLイメージ


用語1


用語2




用語3

* 用語1* 用語2** 用語3

(各行の間に、改行のみの空行を一行はさんでいる)<ul> <li>用語1</li></ul><ul> <li>用語2</li></ul><ul> <li> <ul> <li>用語3</li> </ul> </li></ul>ulli 用語1ulli 用語2ulliulli 用語3

用語1

用語2


用語3

# 用語1# 用語2## 用語3

(各行の間に、改行のみの空行を一行はさんでいる)<ol> <li>用語1</li></ol><ol> <li>用語2</li></ol><ol> <li> <ol> <li>用語3</li> </ol> </li></ol>olli 用語1olli 用語2olliolli 用語3


次ページ
記事の検索
おまかせリスト
▼オプションを表示
ブックマーク登録
mixiチェック!
Twitterに投稿
オプション/リンク一覧
話題のニュース
列車運行情報
暇つぶしWikipedia

Size:27 KB
出典: フリー百科事典『ウィキペディア(Wikipedia)
担当:undef