ヘルプ:表の作り方
提供：MTG Wiki
以下で、「行」は「表の横一列」、「列」は「縦一列」を意味します。 構文上の改行記号で区切られる「行」については「ライン」と表記しますので、混同しないでください。
目次 |
基本的な枠組み
この節の記号はすべて行頭に書かなくてはいけません。
表の記述は必ず{|で始まり、|}で終わります。
表に関する記述は全てこの間に書きます。
{|
表の中身に関する記述
|}
|-で新しい行の開始となります。
最初の行では省略可能です。
{|
|- （←省略可能）
1行目の中身に関する記述
|-
2行目の中身に関する記述
|}
セルは|で始まります。セルが1行に複数ある場合、
セルは||か改行で区切ります。
改行で区切った場合、新しいラインにも|が必要です。
例えば、以下の1行目と2行目は同じ出力結果になります。
{|
|-
| セル 1
| セル 2
| セル 3
|-
| セル 1 || セル 2 || セル 3
|}
|の代わりに!で始めると見出しになります。
見出しは自動的にセンタリングされ、太字になります。
見出しのセル区切りは||でも可能ですが、大抵は区別しやすいように!!で区切ります。
!で始まるラインはすべて見出しとして扱われるため、
同じ行に見出しでないセルを書く場合は改行してラインを新しくする必要があります。
{|
|-
! 列見出し 1 !! 列見出し 2 !! 列見出し 3
|-
! 行見出し 1
| セル 1-2
| セル 1-3
|-
! 行見出し 2
| セル 2-2 || セル 2-3
|}
上のように記述すると、以下の通りに出力されます。
| 列見出し 1 | 列見出し 2 | 列見出し 3 |
|---|---|---|
| 行見出し 1 | セル 1-2 | セル 1-3 |
| 行見出し 2 | セル 2-2 | セル 2-3 |
パラメータ
基本的な枠組みに対してパラメータを設定していくことで、表を加工することができます。 例えば、セルを結合する、色をつけるなどです。 パラメータは表全体、各行、各セルのいずれにもつけることができます。
{| 表全体のパラメータ
|- 行のパラメータ
! 見出しセルのパラメータ | 見出し
| セルAのパラメータ | セルA || セルBのパラメータ | セルB
|}
パラメータの多くはstyle属性のプロパティとして記述していきます。 同時に複数のプロパティを指定する場合、プロパティの最後に;（セミコロン）を付け、 半角スペースを空けてから次のプロパティを書きます（最後に書くプロパティの後ろには不要です）。
使用できる主なパラメータを以下に記載しておきます。
罫線
表全体のパラメータに、
{| class="wikitable"
と書けば罫線が付くはずなのですが、MTG Wikiでは上手く働いていない気がします。 そのうち改善されるかもしれないので、とりあえず付けておいてもいいでしょう。
border属性を使用することでも罫線を表示できます。ただし、上記の方法に比べて太い罫線になるようです。
{| border="1"
セルの結合
セルのパラメータにrowspan属性を指定すると下に向かってセルを縦に結合できます。 colspan属性を指定すると右に向かってセルを横に結合できます。どちらも結合するセル数を指定します。
{| border="1"
|-
! || 列1 || 列2 || 列3
|-
! 行1
| rowspan="2" | A || colspan="2" | B
|-
! 行2
| C <!-- 列1はセルAに塞がれている -->
| D
|-
! 行3
| E
| rowspan="2" colspan="2" | F
|-
! 行4
| G <!-- 列2と3はセルFに塞がれている -->
|-
! 行5
| colspan="3" | H
|}
上のように記述すると、以下の通りに出力されます。
| 列1 | 列2 | 列3 | |
|---|---|---|---|
| 行1 | A | B | |
| 行2 | C | D | |
| 行3 | E | F | |
| 行4 | G | ||
| 行5 | H | ||
表の幅とセルの幅
表の幅を指定する場合は、表のパラメータにwidthプロパティを記述します。 セルの幅を指定する場合は、セルのパラメータにwidthプロパティを記述します。
単位は%かemです。%指定は、表の幅の場合には画面全体の幅、セルの場合は表全体の幅に対して 占める割合を意味します。em指定は、それが文字幾つ分の大きさなのか指定します。
セルの幅を指定した場合、それは同じ列の全てのセルに適用されます。
<code>{| border="1" style="width:80%"
| style="width:50%" | 幅 50% のセル
| style="width:10em" | 幅 10em のセル
| 幅を指定しないセル
|}
| 幅 50% のセル | 幅 10em のセル | 幅を指定しないセル |
セル内の文字配置
センタリングや右寄せは、text-alignプロパティで指定できます。 これは表全体、各行、各セルのいずれにも使用可能で、 使用した範囲に含まれる全てのセルが影響を受けます。
{| border="1" style="width:80%"
| style="text-align:left" | 左寄せ
| style="text-align:center" | 中央寄せ
| style="text-align:right" | 右寄せ
|}
| 左寄せ | 中央寄せ | 右寄せ |
表の配置
表は通常は左寄せで配置されますが、表全体のパラメータで指定すると中央寄せや右寄せもできます。
中央寄せの場合
{| style="margin:0 auto"
右寄せの場合
{| style="float:right"
色
背景色の指定にはbackground-colorプロパティ、文字色の指定にはcolorプロパティを使います。 これは表全体、各行、各セルのいずれにも使用可能で、使用した範囲に含まれる全てのセルが影響を受けます。
{| class="wikitable" style="background-color:#fdd" <!-- 表全体の背景色をピンクに -->
|+ 表の色を設定する
! 見出しセル <!-- wikitable で見出しセルへの指定が上書きされる…はずが、そうなっていない -->
! 見出しセル
! style="background-color:#dfd" | 背景色を変更した見出し
|-
| style="color:#007" | 文字色を変更したセル
| セル
| セル
|-
| セル
| style="color:#fff; background-color:#700" | 背景色と文字色を変更したセル
| セル
|- style="background-color:#ddf"
| 行全体の || 背景色を || 変更
|}
| 見出しセル | 見出しセル | 背景色を変更した見出し |
|---|---|---|
| 文字色を変更したセル | セル | セル |
| セル | 背景色と文字色を変更したセル | セル |
| 行全体の | 背景色を | 変更 |
