Template:Columns/doc
 | これはTemplate:Columnsの解説サブページです。 使用方法、カテゴリ、およびその他テンプレート自体に含まれない情報を収容しています。 |
 | このテンプレートは本当の列ではなく表を作ります。そのためモバイルデバイスや小さい画面では表示が完全でなく、アクセシビリティの観点から望ましくありません。CSSに基づいた段組みテンプレートを代わりに用いるか、段組みを使わないことを考えてください。 |
使い方
[編集]{{columns
|bgcol = <!--背景色 （既定値 無し)-->
|colwidth = <!--カラムの幅 （既定値 15em）-->
|gap = <!--カラム間の幅 （既定値 1.25em）-->
|col1width = <!--col1でのみ指定するカラムの幅-->
|col1 = <!--入力必須-->
|col2width = <!--col2でのみ指定するカラムの幅-->
|col2 = <!--入力必須-->
|col3width =
|col3 =
...
|col7width =
|col7 =
}}
使用例
[編集]- 入力例
{{columns
|col1 = Simplest<br/>instantiation<br/>of
|col2 = this<br/>template
}}
- 表示結果
|
Simplest instantiation of |
this template |
- 入力例
{{columns |bgcol=beige |width=8.5em |gap=3.25em
|col1 =
* These
* columns
* are
* more
* complex
|col2 =
The<br/>background<br/>is<br/>beige
|col3 =
; Each : column
; is : 8.5[[:en:Em (typography)|em]]
; wide
|col4 =
{{{!}}
!colspan="2"{{!}} and
{{!-}}
{{!}} the {{!!}} gap
{{!-}}
{{!}}colspan="2"{{!}} between
{{!-}}
{{!}} each {{!!}} is
{{!-}}
!colspan="2" style="text-align:center;"{{!}} 3.25em
{{!}}}
}}
- 表示結果
|
The background is beige |
|
|
|||||||||||||
カテゴリー
[編集]このテンプレートを使用している記事は「Category:段組みにテーブルを使用している記事」に分類されます。
関連項目
[編集]段組みテンプレート
[編集] | これらのテンプレートに互換性はありません。例として、{{Multicol}}に{{Multicol-end}}ではなく{{col-end}}を併用すると、HTMLの "div" (division) が閉じられず、以降の表示に不具合が発生します。 |
|
：可能 | 
|
：不可能 |
| テンプレート群 | 種類 | ウィキテーブルコード
の処理  |
レスポンシブ・デザイン モバイル対応 |
最初 | 段組み分け | 最後 |
|---|---|---|---|---|---|---|
| "Col" | Table |
|
|
{{Col-begin}} または{{Col-begin-small}} |
{{Col-break}} {{Col-2}} .. {{Col-5}} |
{{Col-end}} |
| "Columns" | Table |
|
|
{{Columns}} | – | – |
| "Multicol" | Table |
|
|
{{Multicol}} | {{Multicol-break}} | {{Multicol-end}} |
| "Col-float" | CSS float |
|
|
{{Col-float}} | {{Col-float-break}} | {{Col-float-end}} |
| "Columns-start" | CSS float |
|
|
{{Columns-start}} | {{Column}} | {{Columns-end}} |
| "Div col" | CSS columns |
|
|
{{Div col}} | {{No col break}}（引数の内容を分割させない指定） | {{Div col end}} |
| "Columns-list" | CSS columns |
|
|
{{Columns-list}} | – | – |
"Flexbox"
|
CSS Flexbox |
|
|
{{Flexbox}} | {{Flex-item}} {{Flex-item start}} .. {{Flex-item end}} |
– |
| "Flexbox start"
|
CSS Flexbox |
|
|
{{Flexbox start}} | {{Flexbox end}} |
ウィキマークアップ(Help:ページの編集#マークアップ) ({|||||-|}) を使った表作成の処理が出来るかどうか。処理が出来ない場合は、{{(!}}, {{!}}, {{!!}}, {{!-}}, {{!)}}などの要素、または、HTMLタグ (<table>...</table>,<tr>...</tr>など) を使用する必要があります。
Flexboxテンプレートは、セクションや図・表を左右に並べるといった段組み的な表示に使用することができます。CSS columnsを使用するテンプレート同様、複数の画面幅に対応したレイアウトに適しています。