{|
|りんご
|みかん
|いちご
|もも
|-
|メロン
|パイナップル
|マンゴー
|グレープフルーツ
|}
iPentec Document の新しいテーブルの整形ルールを紹介します。
従来のテーブルの整形ルールでは、小さな表を記述するには便利でしたが、表のテキストが長くなった場合に編集しにくい問題がありました。新しい整形ルールではMediaWikiの表記述に似た書式で記述ができます。
表の開始は {| 記述で開始し、表の終了を |} で記述します。
セルは行頭に|を記述し、1行に1セルを記述します。行の改行は行頭に|-を記述します。
{|
|りんご
|みかん
|いちご
|もも
|-
|メロン
|パイナップル
|マンゴー
|グレープフルーツ
|}
| りんご | みかん | いちご | もも |
| メロン | パイナップル | マンゴー | グレープフルーツ |
改行しない場合はセルの区切りを||で区切ります。
{|
|りんご||みかん||いちご||もも
|-
|メロン||パイナップル||マンゴー||グレープフルーツ
|}
| りんご | みかん | いちご | もも |
| メロン | パイナップル | マンゴー | グレープフルーツ |
{|
|||みかん||||もも
|-
|||パイナップル||||グレープフルーツ
|-
|||いちご||||なし
|}
| みかん | もも | ||
| パイナップル | グレープフルーツ | ||
| いちご | なし |
{|
|りんご||みかん
|ABCDEFGHIJKLMNOPQRSTUVWXYZ||もも
|-
|メロン||パイナップル
|ABCDEFGHIJKLMNOPQRSTUVWXYZ||グレープフルーツ
|}
| りんご | みかん | ABCDEFGHIJKLMNOPQRSTUVWXYZ | もも |
| メロン | パイナップル | ABCDEFGHIJKLMNOPQRSTUVWXYZ | グレープフルーツ |
表のキャプションは表の開始直後の行で |+ を記述します。
{|
|+商品価格
|-
|ぺんぎんクッキー
|\300
|-
|らくだサブレ
|\450
|}
| ぺんぎんクッキー | \300 |
| らくだサブレ | \450 |
表のヘッダは票の開始直後に ! を記述します。
{|
!品名
!価格
|-
|ぺんぎんクッキー
|\300
|-
|らくだサブレ
|\450
|}
| 品名 | 価格 |
|---|---|
| ぺんぎんクッキー | \300 |
| らくだサブレ | \450 |
テーブルキャプションと組み合わせる場合は、先にテーブルキャプションの|+を記述します。
{|
|+商品価格
|-
!品名
!価格
|-
|ぺんぎんクッキー
|\300
|-
|らくだサブレ
|\450
|}
| 品名 | 価格 |
|---|---|
| ぺんぎんクッキー | \300 |
| らくだサブレ | \450 |
ヘッダを改行せずに記述する場合は !! で区切ります。
{|
|+商品価格
!品名!!価格
|-
|ぺんぎんクッキー||\300
|-
|らくだサブレ||\450
|}
| 品名 | 価格 |
|---|---|
| ぺんぎんクッキー | \300 |
| らくだサブレ | \450 |
テーブルのクラスを指定する場合は、テーブル開始記述{|の直後に class を記述します。
現在のバージョンでは次のクラスが定義されています。クラスを指定しなかった場合はStandardTableが設定されます。
| クラス名 | 表示スタイル |
|---|---|
| StandardTable | 標準的な表のスタイルです |
| ListTable | 列の区切り線が無いスタイルです |
{| class="ListTable"
|+商品価格
!品名
!価格
|-
|ぺんぎんクッキー
|\300
|-
|らくだサブレ
|\450
|}
または
{| class="ListTable"
|+商品価格
!品名!!価格
|-
|ぺんぎんクッキー||\300
|-
|らくだサブレ||\450
|}
| 品名 | 価格 |
|---|---|
| ぺんぎんクッキー | \300 |
| らくだサブレ | \450 |
テーブルのクラスを指定する場合は、テーブル開始記述{|の直後に style を記述します。
{| style="font-size:9px"
|りんご
|みかん
|いちご
|もも
|-
|メロン
|パイナップル
|マンゴー
|グレープフルーツ
|}
| りんご | みかん | いちご | もも |
| メロン | パイナップル | マンゴー | グレープフルーツ |
テーブルのフォントサイズを指定できます。従来の書式ではテーブル全体を #design 指令で囲む必要がありましたが、新しいスタイルでは直接スタイルが指定できるようになります。
列やセルにスタイルを指定する場合は、セルのテキストを|で区切り、前半部分にstyleを記述します。
{|
!style="width:280px"|品名
!価格
|-
|ぺんぎんクッキー
|\300
|-
|らくだサブレ
|\450
|}
| 品名 | 価格 |
|---|---|
| ぺんぎんクッキー | \300 |
| らくだサブレ | \450 |
{|
|りんご
|みかん
|いちご
|もも
|-
|メロン
|style="background-color:#C0E0E0;"|パイナップル
|マンゴー
|グレープフルーツ
|}
| りんご | みかん | いちご | もも |
| メロン | パイナップル | マンゴー | グレープフルーツ |
列やセルにscope属性を指定する場合は、セルのテキストを|で区切り、前半部分にstyleを記述します。
{|
!scope="col"|品名
!scope="col"|価格
|-
|scope="row"|ぺんぎんクッキー
|\300
|-
|scope="row"|らくだサブレ
|\450
|}
| 品名 | 価格 |
|---|---|
| ぺんぎんクッキー | \300 |
| らくだサブレ | \450 |
