「wikiの編集例/表組み（テーブル)/基本的な表(テーブル)」の編集履歴（バックアップ）一覧はこちら

「wikiの編集例/表組み（テーブル)/基本的な表(テーブル)」(2023/05/12 (金) 19:28:27) の最新版変更点

追加された行は緑色になります。

削除された行は赤色になります。

#contents(from=here)

----
*表(テーブル)の入力方法
 |aaa|bbb|ccc|
 |ddd|eee|fff|
と入力すると、
|aaa|bbb|ccc|
|ddd|eee|fff|
と表示されます。

**「｜」記号の入力方法
アットウィキモードで表を入力するには 行頭を「|」ではじめて「|」で区切ります。
 |
の記号はシフトキーを押しながら、キーボードの右上の方にある「￥」マークのキーを押すことで、入力できます。

---------
*表(テーブル)のヘッダの作成
見出しテキストの前に~(チルダ記号)を記述することで、表における見出しとなります。
atwikiモードでは、省略系として見出し行の末尾にhを指定することでも動作します。

当ガイドでは、編集モードが pukiwikiライクモード, atwikiモード のどちらの場合でも見出しとして動作するよう、以下のようにどちらも記載していることがあります。
//
 |~aaa|~bbb|~ccc|h
 |ddd|eee|fff|
//
と入力すると、

|~aaa|~bbb|~ccc|h
|ddd|eee|fff|

と表示されます。

---------------

*プラグインによる表（テーブル）の装飾
以下のプラグインで、表を装飾できます。
構文で入力することで同様のことができることもありますが、構文で記載する場合と比べ、記載を簡略化することが可能です。また、table_sorterプラグインは表にソート機能を付与することができます。
記載方法など、詳しくは以下のリンクをご確認ください。
-[[テーブル装飾プラグイン（table_style）>https://w.atwiki.jp/guide/pages/265.html#id_d331d072]]
-[[テーブル色付けプラグイン(奇数行・偶数行)(table_zebra)>https://www1.atwiki.jp/guide/pages/265.html#id_20b655e5]]
-[[表（テーブル）ソートプラグイン(table_sorter)>https://www1.atwiki.jp/guide/pages/265.html#id_ab6d9c89]]
-[[表（テーブル）自動連番付与プラグイン（table_autoincrement）>https://www1.atwiki.jp/guide/pages/265.html#id_df582661]]

以下はtable_styleプラグインの入力例です。
 #table_style(head=#FFB34B:#FFFFFF:120%, hover=#C08:#EFEFEF:center){
   列1=#DDEEFF:bold,
   列2=#333322:#FFFFFF:center,
   列3=#AAFFFF:italic:right
 }
 |~列1|~列2|~列3|h
 |1|2|3|
 |1|2|3|
 |1|2|3|
#table_style(head=#FFB34B:#FFFFFF:120%, hover=#C08:#EFEFEF:center){
  列1=#DDEEFF:bold,
  列2=#333322:#FFFFFF:center,
  列3=#AAFFFF:italic:right
}
|~列1|~列2|~列3|h
|1|2|3|
|1|2|3|
|1|2|3|

----
*セル内の上揃え、中央揃え、下揃え
上揃えにする場合には、先頭に「TOP:」をつけます。
中央揃えにする場合には、先頭に「MIDDLE:」をつけます。
下揃えにする場合には、先頭に「BOTTOM:」をつけます。

入力例）
 |TOP:aaa|MIDDLE:bbb|BOTTOM:ccc|&br()&br()&br()|
と入力すると、
|TOP:aaa|MIDDLE:bbb|BOTTOM:ccc|&br()&br()&br()|
と表示されます。


-----
* セルの左寄せ、中央寄せ、右寄せ
セルの中で左寄せ、中央寄せ、右寄せをすることができます。
各セルでLEFT: CENTER: RIGHT: という命令をそのセルの先頭に記載します。
何も指定しない場合は左寄せになります。

入力例)
 |指定なしのサンプル|LEFT指定のサンプル|CENTER指定のサンプル|RIGHT指定のサンプル|h
 |a|LEFT:b|CENTER:c|RIGHT:d|

|指定なしのサンプル|LEFT指定のサンプル|CENTER指定のサンプル|RIGHT指定のサンプル|h
|a|LEFT:b|CENTER:c|RIGHT:d|


-----
*文字サイズ、文字色、背景色
文字サイズを指定するには、先頭に「SIZE(文字サイズ):」をつけます。
文字色を指定するには、先頭に「COLOR(カラーコード):」をつけます。
背景色を指定するには、先頭に「BGCOLOR(カラーコード):」をつけます。

入力例）
 |SIZE(20):文字のサイズを20pxにする|
 |COLOR(red):文字色を赤(red)にする|
 |BGCOLOR(yellow):背景色を黄色(yellow)にする|
 |BGCOLOR(#000):COLOR(#fff):背景色を黒(#000)に、文字色を白(#fff)にする|
と入力すると、
|SIZE(20):文字のサイズを20pxにする|
|COLOR(red):文字色を赤(red)にする|
|BGCOLOR(yellow):背景色を黄色(yellow)にする|
|BGCOLOR(#000):COLOR(#fff):背景色を黒(#000)に、文字色を白(#fff)にする|
と表示されます。


また、上記の文字装飾につきましては、[[文字装飾プラグイン(&font)>http://www1.atwiki.jp/guide/pages/265.html#id_f2292d4f]]を使うことでも
実現できます。※&fontプラグインでの背景色に関しましては、文字の背景のみとなります。

入力例）
 |&font(20px){文字のサイズを20pxにする}|
 |&font(red){文字色を赤(red)にする}|
 |&font(black,yellow){背景色を黄色(yellow)にする}|
 |&font(#fff,#000){背景色を黒(#000)に、文字色を白(#fff)にする}|
と入力すると、
|&font(20px){文字のサイズを20pxにする}|
|&font(red){文字色を赤(red)にする}|
|&font(black,yellow){背景色を黄色(yellow)にする}|
|&font(#fff,#000){背景色を黒(#000)に、文字色を白(#fff)にする}|
と表示されます。

-----
*セル内での改行 
セル内での改行には、[[改行プラグイン(&br)>http://www1.atwiki.jp/guide/pages/265.html#id_ef4a87a1]]を使います。

入力例）
 |aaa&br()aaa|bbb|ccc|
 |aaa|bbb|ccc|
 |aaa|bbb|ccc|
と入力すると、
|aaa&br()aaa|bbb|ccc|
|aaa|bbb|ccc|
|aaa|bbb|ccc|
と表示されます。

#contents(from=here)

----
*表(テーブル)の入力方法
 |aaa|bbb|ccc|
 |ddd|eee|fff|
と入力すると、
|aaa|bbb|ccc|
|ddd|eee|fff|
と表示されます。

**「｜」記号の入力方法
アットウィキモードで表を入力するには 行頭を「|」ではじめて「|」で区切ります。
 |
の記号はシフトキーを押しながら、キーボードの右上の方にある「￥」マークのキーを押すことで、入力できます。

---------
*表(テーブル)のヘッダの作成
見出しテキストの前に~(チルダ記号)を記述することで、表における見出しとなります。
atwikiモードでは、省略系として見出し行の末尾にhを指定することでも動作します。

当ガイドでは、編集モードが pukiwikiライクモード, atwikiモード のどちらの場合でも見出しとして動作するよう、以下のようにどちらも記載していることがあります。
//
 |~aaa|~bbb|~ccc|h
 |ddd|eee|fff|
//
と入力すると、

|~aaa|~bbb|~ccc|h
|ddd|eee|fff|

と表示されます。

---------------

*プラグインによる表（テーブル）の装飾
以下のプラグインで、表を装飾できます。
構文で入力することで同様のことができることもありますが、構文で記載する場合と比べ、記載を簡略化することが可能です。また、table_sorterプラグインは表にソート機能を付与することができます。
記載方法など、詳しくは以下のリンクをご確認ください。
-[[テーブル装飾プラグイン（table_style）>https://w.atwiki.jp/guide/pages/265.html#id_d331d072]]
-[[テーブル色付けプラグイン(奇数行・偶数行)(table_zebra)>https://www1.atwiki.jp/guide/pages/265.html#id_20b655e5]]
-[[表（テーブル）ソートプラグイン(table_sorter)>https://www1.atwiki.jp/guide/pages/265.html#id_ab6d9c89]]
-[[表（テーブル）自動連番付与プラグイン（table_autoincrement）>https://www1.atwiki.jp/guide/pages/265.html#id_df582661]]

以下はtable_styleプラグインの入力例です。
 #table_style(head=#FFB34B:#FFFFFF:120%, hover=#C08:#EFEFEF:center){
   列1=#DDEEFF:bold,
   列2=#333322:#FFFFFF:center,
   列3=#AAFFFF:italic:right
 }
 |~列1|~列2|~列3|h
 |1|2|3|
 |1|2|3|
 |1|2|3|
#table_style(head=#FFB34B:#FFFFFF:120%, hover=#C08:#EFEFEF:center){
  列1=#DDEEFF:bold,
  列2=#333322:#FFFFFF:center,
  列3=#AAFFFF:italic:right
}
|~列1|~列2|~列3|h
|1|2|3|
|1|2|3|
|1|2|3|

----
*セル内の上揃え、中央揃え、下揃え
上揃えにする場合には、先頭に「TOP:」をつけます。
中央揃えにする場合には、先頭に「MIDDLE:」をつけます。
下揃えにする場合には、先頭に「BOTTOM:」をつけます。

入力例）
 |TOP:aaa|MIDDLE:bbb|BOTTOM:ccc|&br()&br()&br()|
と入力すると、
|TOP:aaa|MIDDLE:bbb|BOTTOM:ccc|&br()&br()&br()|
と表示されます。


-----
* セルの左寄せ、中央寄せ、右寄せ
セルの中で左寄せ、中央寄せ、右寄せをすることができます。
各セルでLEFT: CENTER: RIGHT: という命令をそのセルの先頭に記載します。
何も指定しない場合は左寄せになります。

入力例)
 |指定なしのサンプル|LEFT指定のサンプル|CENTER指定のサンプル|RIGHT指定のサンプル|h
 |a|LEFT:b|CENTER:c|RIGHT:d|

|指定なしのサンプル|LEFT指定のサンプル|CENTER指定のサンプル|RIGHT指定のサンプル|h
|a|LEFT:b|CENTER:c|RIGHT:d|


-----
*文字サイズ、文字色、背景色
文字サイズを指定するには、先頭に「SIZE(文字サイズ):」をつけます。
文字色を指定するには、先頭に「COLOR(カラーコード):」をつけます。
背景色を指定するには、先頭に「BGCOLOR(カラーコード):」をつけます。

入力例）
 |SIZE(20):文字のサイズを20pxにする|
 |COLOR(red):文字色を赤(red)にする|
 |BGCOLOR(yellow):背景色を黄色(yellow)にする|
 |BGCOLOR(#000):COLOR(#fff):背景色を黒(#000)に、文字色を白(#fff)にする|
と入力すると、
|SIZE(20):文字のサイズを20pxにする|
|COLOR(red):文字色を赤(red)にする|
|BGCOLOR(yellow):背景色を黄色(yellow)にする|
|BGCOLOR(#000):COLOR(#fff):背景色を黒(#000)に、文字色を白(#fff)にする|
と表示されます。


また、上記の文字装飾につきましては、[[文字装飾プラグイン(&font)>http://www1.atwiki.jp/guide/pages/265.html#id_f2292d4f]]を使うことでも
実現できます。
※fontプラグインでの背景色に関しましては、文字の背景のみとなります。

入力例）
 |&font(20px){文字のサイズを20pxにする}|
 |&font(red){文字色を赤(red)にする}|
 |&font(black,yellow){背景色を黄色(yellow)にする}|
 |&font(#fff,#000){背景色を黒(#000)に、文字色を白(#fff)にする}|
と入力すると、
|&font(20px){文字のサイズを20pxにする}|
|&font(red){文字色を赤(red)にする}|
|&font(black,yellow){背景色を黄色(yellow)にする}|
|&font(#fff,#000){背景色を黒(#000)に、文字色を白(#fff)にする}|
と表示されます。

-----
*セル内での改行 
セル内での改行には、[[改行プラグイン(&br)>http://www1.atwiki.jp/guide/pages/265.html#id_ef4a87a1]]を使います。

入力例）
 |aaa&br()aaa|bbb|ccc|
 |aaa|bbb|ccc|
 |aaa|bbb|ccc|
と入力すると、
|aaa&br()aaa|bbb|ccc|
|aaa|bbb|ccc|
|aaa|bbb|ccc|
と表示されます。