Википедия:Таблицы

Материал из Википедии — свободной энциклопедии
(перенаправлено с «Википедия:Как делать таблицы»)
Перейти к: навигация, поиск
↱ ВП:Т
ВП:ТАБ
Написание статей Написание статей
Тематические статьи
 • Об астрономии 
 • О программах
 • О Формуле-1
 • Об ИТ
 • О персонах
 • О метро
 • О химических веществах
Техническая справка
Общие правила

Список правил и руководств

Таблицы являются удобной формой для отображения информации. Но таблицы выполняют лишь тогда свою цель, когда между строчками и столбцами имеется смысловая связь, то есть информацию в них можно рассортировать неким образом, например, по дате или алфавиту.

С другой стороны, таблицы сложнее обычного текста. Так что применять их имеет смысл лишь там, где они действительно улучшают восприятие материала. Поэтому предварительно обдумывайте: не лучше ли использовать обычный cписок. И постарайтесь делать таблицу как можно проще, чтобы и менее опытные участники могли вносить в неё изменения.

Рекомендуется также следовать правилам оформления таблиц, особенно в случаях, если цветовое оформление не несёт специального смысла.

Содержание

Основы[править вики-текст]

Ячейки[править вики-текст]

Любая таблица состоит из ячеек. Простейшая таблица состоит из одной ячейки:

Это ячейка

Cложные таблицы состоят из множества ячеек:

Это ячейка
и это ячейка
и это ячейка

Строки и столбцы[править вики-текст]

Ячейки могут объединяться в строки и/или столбцы. Таблицы, состоящие из двух и более строк, называются многострочными.

Это строка
и это строка
и это строка
Это столбец и это столбец и это столбец

Заголовок таблицы[править вики-текст]

Дополнительным элементом таблицы является заголовок таблицы.

Это заголовок таблицы
Ячейка 1 Ячейка 2 Ячейка 3
Ячейка 4 Ячейка 5 Ячейка 6
Ячейка 7 Ячейка 8 Ячейка 9

Заголовок строки или столбца[править вики-текст]

Строки и столбцы в таблице тоже могут иметь заголовки.

Это заголовок столбца и это заголовок столбца
Ячейка 1 Ячейка 2
Ячейка 3 Ячейка 4
Ячейка 5 Ячейка 6
и это заголовок строки Ячейка 1 Ячейка 2 Ячейка 3
Это заголовок строки Ячейка 4 Ячейка 5 Ячейка 6
и это заголовок строки Ячейка 7 Ячейка 8 Ячейка 9

Исходный код таблицы[править вики-текст]

{| начало таблицы Обязательно.
|+ заголовок таблицы Необязательно.
Может находиться только между началом таблицы и первой строкой таблицы
|- строка таблицы Необязательно.
Может быть опущен для первой строки.
! ячейка заголовка таблицы Необязательно.
Идущие подряд ячейки заголовка таблицы могут быть указаны в одной строке, разделённые двойным маркером (!!), или начинаться с новой строки с одиночным маркером (!).
| ячейка данных Необязательно.
Идущие подряд ячейки данных могут быть указаны на одной строке, разделённые двойным маркером (||), или начинаться каждый с новой строки, предваряемые одиночным маркером (|).
|} конец таблицы Обязательно.

Открывающие и закрывающие элементы[править вики-текст]

Исходный код таблицы заключается в фигурные скобки {  }. Первая фигурная скобка исходного кода таблицы называется открывающей скобкой, последняя — закрывающей. После открывающей скобки таблицы ставится вертикальная черта |. Вертикальная черта также ставится перед закрывающей скобкой таблицы. Открывающая скобка таблицы с вертикальной чертой называется открывающим элементом таблицы, а вертикальная черта с закрывающей скобкой — закрывающим элементом таблицы.

Исходный код: Представление в Википедии:
{|
 |Lorem ipsum dolor sit amet, 
consetetur sadipscing elitr, 
sed diam nonumy eirmod tempor invidunt
ut labore et dolore magna aliquyam erat, 
sed diam voluptua. 

At vero eos et accusam et justo duo dolores
et ea rebum. Stet clita kasd gubergren,
no sea takimata sanctus est Lorem ipsum
dolor sit amet. 
 |}
Lorem ipsum dolor sit amet,

consetetur sadipscing elitr, sed diam nonumy eirmod tempor invidunt ut labore et dolore magna aliquyam erat, sed diam voluptua.

At vero eos et accusam et justo duo dolores et ea rebum. Stet clita kasd gubergren, no sea takimata sanctus est Lorem ipsum dolor sit amet.

Ячейки[править вики-текст]

Каждая ячейка в таблице начинается с одинарной вертикальной черты |, после которой пишется содержимое ячейки. Между вертикальной чертой и первой буквой текста содержимого ячейки допускается вставлять пробел.

Запись каждой ячейки в таблице начинают, как правило, с новой строчки:

Исходный код: Представление в Википедии:
{| border="1"
 |Ячейка А
 |Ячейка Б
 |Ячейка В
 |}
Ячейка А Ячейка Б Ячейка В

Вики-разметка также позволяет записывать ячейки в одну строчку. При этом, все ячейки, следующие за первой ячейкой в строке, начинаются с двойной вертикальной черты: ||. Например:

Исходный код: Представление в Википедии:
{| border="1"
 |Ячейка А||Ячейка Б||Ячейка В
 |}
Ячейка А Ячейка Б Ячейка В

Строки и столбцы[править вики-текст]

Ячейки в таблице можно организовывать в строки.

Строка таблицы начинается с вертикальной черты, после которой пишется дефис: |-. Таблица может иметь множество строк.

Записи ячеек в табличной строке начинают с новой строчки в исходном коде таблицы. Каждая последующая ячейка в строке может быть записана с новой строчки или в одну строчку.

Пример записи ячеек с новой строчки[править вики-текст]

Исходный код: Представление в Википедии:
{| border="1"
 |-
 |Ячейка А-1
 |Ячейка Б-1
 |Ячейка В-1
 |-
 |Ячейка А-2
 |Ячейка Б-2
 |Ячейка В-2
 |-
 |Ячейка А-3
 |Ячейка Б-3
 |Ячейка В-3
 |}
Ячейка А-1 Ячейка Б-1 Ячейка В-1
Ячейка А-2 Ячейка Б-2 Ячейка В-2
Ячейка А-3 Ячейка Б-3 Ячейка В-3

Запись ячеек в одну строчку позволяет обеспечить визуальную организацию ячеек в столбцы в исходном коде, облегчая работу с содержимым ячеек в многострочных таблицах. При этом отображение таблицы в Википедии ничем не будет отличаться от отображения таблицы, в исходном коде которой каждая ячейка записана с новой строчки.

Пример записи ячеек в одну строчку[править вики-текст]

Исходный код: Представление в Википедии:
{| border="1"
 |-
 |Ячейка А-1||Ячейка Б-1||Ячейка В-1
 |-
 |Ячейка А-2||Ячейка Б-2||Ячейка В-2
 |-
 |Ячейка А-3||Ячейка Б-3||Ячейка В-3
 |}
Ячейка А-1 Ячейка Б-1 Ячейка В-1
Ячейка А-2 Ячейка Б-2 Ячейка В-2
Ячейка А-3 Ячейка Б-3 Ячейка В-3

Оформление таблиц[править вики-текст]

Стандартное оформление таблиц в Википедии достигается использованием нескольких стандартных CSS-классов (особых средств для задания цветов, шрифтов, расположения отдельных блоков текста и прочих элементов оформления).

Стандартные классы[править вики-текст]

Класс wikitable первоначально появился в английском разделе Википедии, был портирован в несколько других разделов и через несколько лет в rev:48842 был добавлен в MediaWiki. prettytable также существовал в английском разделе и был идентичен wikitable за исключением цвета заголовка, позже был массово убран. В нашем проекте признан устаревшим, но вероятно всё ещё используется на некоторых страницах.

Остальные классы оформления таблиц и ячеек были придуманы и реализованы только в русском разделе.

sortable и остальные классы сортировки реализованы в MediaWiki (см. wikibits.js). collapsible и остальные классы сворачивания первоначально появились в английском разделе и затем были портированы во многие другие проекты Фонда.

wikitable[править вики-текст]

shared.css:

table.wikitable {
	margin: 1em 0;
	background-color: #f8f9fa;
	border: 1px solid #a2a9b1;
	border-collapse: collapse;
	color: #000;
}

table.wikitable > tr > th,
table.wikitable > tr > td,
table.wikitable > * > tr > th,
table.wikitable > * > tr > td {
	border: 1px solid #a2a9b1;
	padding: 0.2em 0.4em;
}

table.wikitable > tr > th,
table.wikitable > * > tr > th {
	background-color: #eaecf0;
	text-align: center;
}

table.wikitable > caption {
	font-weight: bold;
}

Создаёт таблицу с тонкими границами между всеми ячейками, сероватым цветом фона и серыми заголовками. Универсальный класс, определённый прямо в движке MediaWiki.

 
{| class="wikitable"
|-
!Заголовок 1||Заголовок 2 
|-
|Ячейка 1*1||Ячейка 2*1
|-
|Ячейка 1*2||Ячейка 2*2
|-
|Ячейка 1*3||Ячейка 2*3
|}
Заголовок 1 Заголовок 2
Ячейка 1*1 Ячейка 2*1
Ячейка 1*2 Ячейка 2*2
Ячейка 1*3 Ячейка 2*3

По умолчанию таблица класса wikitable располагается слева без обтекания. Чтобы установить обтекание, необходимо добавить параметр align="right" или align="left". Для создания отступа между границей таблицы и текстом статьи следует добавить параметр style="margin-left:1em" (если align="right") или style="margin-right:1em" (если align="left").

Пример
{| class="wikitable" align="right" style="margin-left:1em"
|-
! Заголовок 1 || Заголовок 2
|-
| Ячейка 1-1 || Ячейка 1-2
|-
| Ячейка 2-1 || Ячейка 2-2
|}
Текст статьиТекст статьиТекст статьиТекст статьиТекст статьиТекст статьиТекст статьиТекст статьиТекст статьиТекст статьиТекст статьиТекст статьиТекст статьиТекст статьиТекст статьиТекст статьиТекст статьиТекст статьи.

Текст статьиТекст статьиТекст статьиТекст статьиТекст статьиТекст статьиТекст статьиТекст статьиТекст статьиТекст статьиТекст статьиТекст статьиТекст статьиТекст статьиТекст статьиТекст статьиТекст статьиТекст статьи.
Результат
Заголовок 1 Заголовок 2
Ячейка 1-1 Ячейка 1-2
Ячейка 2-1 Ячейка 2-2

Текст статьиТекст статьиТекст статьиТекст статьиТекст статьиТекст статьиТекст статьиТекст статьиТекст статьиТекст статьиТекст статьиТекст статьиТекст статьиТекст статьиТекст статьиТекст статьиТекст статьиТекст статьи.

Текст статьиТекст статьиТекст статьиТекст статьиТекст статьиТекст статьиТекст статьиТекст статьиТекст статьиТекст статьиТекст статьиТекст статьиТекст статьиТекст статьиТекст статьиТекст статьиТекст статьиТекст статьи.

standard[править вики-текст]

Похож на wikitable, но имеет следующие отличия:

  • без цвета фона, то есть таблица обычно имеет белый фон страницы;
  • другой цвет заголовочных ячеек;
  • ячейки более узкие по вертикали;
  • отсутствие отступов вокруг таблицы.
 
{| class="standard"
|-
!Заголовок 1||Заголовок 2
|-
|Ячейка 1*1||Ячейка 2*1
|-
|Ячейка 1*2||Ячейка 2*2
|-
|Ячейка 1*3||Ячейка 2*3
|}
Заголовок 1 Заголовок 2
Ячейка 1*1 Ячейка 2*1
Ячейка 1*2 Ячейка 2*2
Ячейка 1*3 Ячейка 2*3

wide[править вики-текст]

Отличается от standard только тем, что растягивает таблицу на всю ширину страницы.

{| class="wide"
...
Заголовок 1 Заголовок 2 Заголовок 3
Ячейка 1*1 Ячейка 2*1 Ячейка 3*1
Ячейка 1*2 Ячейка 2*2 Ячейка 3*2
Ячейка 1*3 Ячейка 2*3 Ячейка 3*3

Функциональные классы[править вики-текст]

Эти дополнительные классы добавляют таблицам интерактивность с помощью JavaScript.

collapsible[править вики-текст]

Тема
Заголовок 1 Заголовок 2 Заголовок 3
Ячейка 1*1 Ячейка 2*1 Ячейка 3*1
Ячейка 1*2 Ячейка 2*2 Ячейка 3*2

Позволяет «сворачивать» таблицу, оставляя лишь заголовки, например {| class="wikitable collapsible"

Подробнее см. Википедия:Сворачивающиеся блоки.


sortable[править вики-текст]

Позволяет сортировать столбцы таблицы.

Чтобы сделать столбец несортируемым, добавьте класс unsortable к выбранной ячейке в заголовке таблицы:

{| class="standard sortable"
|-
! Латиница || Кириллица || class="unsortable" | Цифры
|-
| D || Г || 3 
|-
| E || Щ || 2
|-
| F || Б || 11
|}
Латиница Кириллица Цифры
D Г 3
E Щ 2
F Б 11

Чтобы сделать последнюю строку в таблице (например, строку итогов) несортируемой, добавьте к ней класс sortbottom:

{| class="wikitable sortable"
! Имя !! Число
|-
| Юрий || 1,85
|-
| Андрей || 1,89
|-
| Сергей || 1,72
|- class="sortbottom"
! ''Среднеe:'' !! 1,82'''
|}
Имя Число
Юрий 1,85
Андрей 1,89
Сергей 1,72
Среднеe: 1,82

Тип сортировки столбца определяется каждый раз заново при нажатии на кнопку сортировки и зависит от текущего содержимого самой верхней ячейки. К примеру, если в этой ячейке пусто, то столбец будет отсортирован как массив строк (где «8» > «122»), несмотря на содержимое следующих ячеек. Это исправляется добавлением в начало ячейки невидимого значения для сортировки (например, <span style="display:none">0</span> , или при помощи шаблона {{~}}), либо использованием параметра data-sort-value.

Подробнее о сортировке см. m:Help:Sorting (англ.).

mw-datatable[править вики-текст]

shared.css:

.mw-datatable {
	border-collapse: collapse;
}

.mw-datatable,
.mw-datatable td,
.mw-datatable th {
	border: 1px solid #a2a9b1;
	padding: 0 0.15em 0 0.15em;
}

.mw-datatable th {
	background-color: #ddf;
}

.mw-datatable td {
	background-color: #fff;
}

.mw-datatable tr:hover td {
	background-color: #eaf3ff;
}

Позволяет создать таблицу с цветным заголовком и с подсветкой строк при наведении.

 
{| class="mw-datatable"
|-
!Заголовок 1||Заголовок 2 
|-
|Ячейка 1*1||Ячейка 2*1
|-
|Ячейка 1*2||Ячейка 2*2
|-
|Ячейка 1*3||Ячейка 2*3
|}
Заголовок 1 Заголовок 2
Ячейка 1*1 Ячейка 2*1
Ячейка 1*2 Ячейка 2*2
Ячейка 1*3 Ячейка 2*3

Классы оформления ячеек[править вики-текст]

highlight bright shadow dark
заголовок
обычная ячейка

Также в русской Википедии есть два класса подсветки и два типа затенения отдельных ячеек, при этом классы подсветки придают разные цвета заголовочным «!» и обычным «|» ячейкам.

Эти классы можно добавлять к строке для подсветки сразу всех ячеек строки.

|- class="bright"
| ...
| ...

Или к отдельно взятой ячейке; если нужно просто отменить цвет, заданный в строке, используйте класс transparent.

|-
|class="bright"| ...
|class="highlight"| ...

Например:

         
|-class="dark"     |class="highlight"
|-class="bright"   |class="transparent"  

Для заголовков рекомендуется использовать подсветку highlight, при необходимости выделить более важный заголовок — bright. Если есть необходимость понизить важность заголовка, можно использовать затенение.

Для выделения групп обычных ячеек рекомендуется использовать затенение (сначала shadow, при необходимости — dark). Если нужно выделить одну-две ячейки, можно использовать подсветку.

Если в какой-то ячейке требуется задать определённый цвет фона, задавайте его вот так: style="background-color: цвет;" (см. таблицу цветов). Рекомендуется использовать эту возможность только если необходим именно конкретный цвет, а не просто логическое выделение части ячеек.

Цветовое оформление таблиц[править вики-текст]

Текст, находящийся в таблице, можно сделать цветным. С этой целью применяются те же тэги, что и в HTML:

  • для отдельного слова — <span style="color:#abcdef">Tекст</span>;
  • для длинного текста — <div style="color:#abcdef">Текст, текст.</div>,

где «abcdef» — индекс цвета в Таблице цветов.

Пример:
Для "раскраски" текста пишут так:
{| border="1"
 |Ячейка 1*1
 |Здесь только одно <span style="color:#ff00ff">розовое</span> слово.
 |Ячейка 3*1
 |-
 |Ячейка 1*2
 |Ячейка 2*2
 |<div style="color:#33сс66">А здесь зелёным цветом выделен длинный-длинный абзац.</div>
 |-
 |Ячейка 1*3
 |Ячейка 2*3
 |Ячейка 3*3
 |}

В Википедии это будет выглядеть следующим образом:

Ячейка 1*1 Здесь только одно розовое слово. Ячейка 3*1
Ячейка 1*2 Ячейка 2*2
А здесь выделен зелёным цветом длинный-длинный абзац.
Ячейка 1*3 Ячейка 2*3 Ячейка 3*3

Сделать цветную ячейку можно с помощью атрибута style="background:#rrggbb", где «rrggbb» обозначает индекс цвета в таблице цветов.

Пример:
Для «раскраски» одной ячейки пишется так:
{| border="1"
 |Ячейка 1*1
 |style="background:#ffcc00"|Ячейка 2*1
 |Ячейка 3*1
 |-
 |Ячейка 1*2
 |Ячейка 2*2
 |Ячейка 3*2
 |-
 |style="background:#ccff00"|Ячейка 1*3
 |Ячейка 2*3
 |Ячейка 3*3
 |}

В Википедии это будет выглядеть следующим образом:

Ячейка 1*1 Ячейка 2*1 Ячейка 3*1
Ячейка 1*2 Ячейка 2*2 Ячейка 3*2
Ячейка 1*3 Ячейка 2*3 Ячейка 3*3

Примеры простых таблиц[править вики-текст]

Подробное рассмотрение темы: Вики-форматирование таблиц

Пример таблицы, состоящей из одной строки[править вики-текст]

Пример записи ячеек с новой строчки

Исходный код:   Представление в Википедии:
{|
 |Ячейка 1
 |Ячейка 2
 |Ячейка 3
 |}
   
Ячейка 1 Ячейка 2 Ячейка 3


Пример записи ячеек в одну строчку

Исходный код:   Представление в Википедии:
{|
 |Ячейка 1||Ячейка 2||Ячейка 3
 |}
   
Ячейка 1 Ячейка 2 Ячейка 3

Пример многострочной таблицы[править вики-текст]

Пример записи ячеек с новой строчки

Исходный код:   Представление в Википедии:
{| border="1"
 |-
 |Ячейка А-1
 |Ячейка Б-1
 |Ячейка В-1
 |-
 |Ячейка А-2
 |Ячейка Б-2
 |Ячейка В-2
 |-
 |Ячейка А-3
 |Ячейка Б-3
 |Ячейка В-3
 |}
   
Ячейка А-1 Ячейка Б-1 Ячейка В-1
Ячейка А-2 Ячейка Б-2 Ячейка В-2
Ячейка А-3 Ячейка Б-3 Ячейка В-3

Пример записи ячеек в одну строчку

Исходный код:   Представление в Википедии:
{| border="1"
 |-
 |Ячейка А-1||Ячейка Б-1||Ячейка В-1
 |-
 |Ячейка А-2||Ячейка Б-2||Ячейка В-2
 |-
 |Ячейка А-3||Ячейка Б-3||Ячейка В-3
 |}
   
Ячейка А-1 Ячейка Б-1 Ячейка В-1
Ячейка А-2 Ячейка Б-2 Ячейка В-2
Ячейка А-3 Ячейка Б-3 Ячейка В-3
Подробное рассмотрение темы: Вики-форматирование таблиц

Выравнивание текста в ячейках[править вики-текст]

Таблица
текст
{| class="wikitable"
|-
! Таблица
|-
| текст
|}
Таблица
текст
{| class="wikitable" style="text-align:center"
|-
! Таблица
|-
| текст
|}

Табличные рамки[править вики-текст]

Вид рамки описывается в первой строке, сразу после {|. Не забудьте, что между ними и атрибутом должен быть пробел.

Толщина линий рамки задаётся атрибутом border="n", где «n» — толщина линии:

Исходный код:   В Википедии это будет выглядеть следующим образом:
{| border="1"
 |Ячейка 1*1
 |Ячейка 2*1
 |Ячейка 3*1
 |-
 |Ячейка 1*2
 |Ячейка 2*2
 |Ячейка 3*2
 |-
 |Ячейка 1*3
 |Ячейка 2*3
 |Ячейка 3*3
 |}
   
Ячейка 1*1 Ячейка 2*1 Ячейка 3*1
Ячейка 1*2 Ячейка 2*2 Ячейка 3*2
Ячейка 1*3 Ячейка 2*3 Ячейка 3*3

Изменять оформление рамки таблицы также можно с помощью атрибута class. Подробнее об этом см. «Классы таблиц». Как правило, рекомендуется использовать class="standard":

Исходный код:   В Википедии это будет выглядеть следующим образом:
{| class="standard"
 |Ячейка 1*1
 |Ячейка 2*1
 |Ячейка 3*1
 |-
 |Ячейка 1*2
 |Ячейка 2*2
 |Ячейка 3*2
 |-
 |Ячейка 1*3
 |Ячейка 2*3
 |Ячейка 3*3
 |}
   
Ячейка 1*1 Ячейка 2*1 Ячейка 3*1
Ячейка 1*2 Ячейка 2*2 Ячейка 3*2
Ячейка 1*3 Ячейка 2*3 Ячейка 3*3

Заголовки[править вики-текст]

Заголовок таблицы[править вики-текст]

Таблицу можно снабдить заголовком, который раскрывает смысл содержащихся в таблице данных. Заголовок таблицы по умолчанию располагается по центру по ширине таблицы, однако может быть выровнен по краю таблицы и оформлен с посредством параметров или синтаксиса HTML.

Для того чтобы у таблицы появился заголовок, с новой строчки после открывающего элемента таблицы поставьте вертикальную черту и знак «плюс» |+ и напишите текст заголовка.

Исходный код:   Представление в Википедии:
{| border="1"
 |+ Очень длинный-длинный текст заголовка таблицы.
 |Ячейка 1
 |Ячейка 2
 |-
 |Ячейка 3
 |Ячейка 4
 |}
   
Очень длинный-длинный текст заголовка таблицы.
Ячейка 1 Ячейка 2
Ячейка 3 Ячейка 4

Заголовок строки/столбца[править вики-текст]

Чтобы содержимое ячейки выделялось жирным шрифтом и центрировалось, вместо вертикальных чёрточек ставятся восклицательные знаки. Обычно это применяется для выделения заголовков. Подробнее о стилях оформления таблиц см. Википедия:Оформление таблиц.

Пример:

Исходный код:   Представление в Википедии:
{| border="1"
 !Заголовок 1
 !Заголовок 2
 !Заголовок 3
 |-
 !Заголовок А
 |Ячейка А-2
 |Ячейка А-3
 |-
 !Заголовок Б
 |Ячейка Б-2
 |Ячейка Б-3
 |-
 !Заголовок В
 |Ячейка В-2
 |Ячейка В-3
 |}
   
Заголовок 1 Заголовок 2 Заголовок 3
Заголовок А Ячейка А-2 Ячейка А-3
Заголовок Б Ячейка Б-2 Ячейка Б-3
Заголовок В Ячейка В-2 Ячейка В-3

В классе standard заголовки подсвечиваются:

Исходный код:   Представление в Википедии:
{| class="standard"
 !Заголовок 1
 !Заголовок 2
 !Заголовок 3
 |-
 !Заголовок А
 |Ячейка А-2
 |Ячейка А-3
 |-
 !Заголовок Б
 |Ячейка Б-2
 |Ячейка Б-3
 |-
 !Заголовок В
 |Ячейка В-2
 |Ячейка В-3
 |}
   
Заголовок 1 Заголовок 2 Заголовок 3
Заголовок А Ячейка А-2 Ячейка А-3
Заголовок Б Ячейка Б-2 Ячейка Б-3
Заголовок В Ячейка В-2 Ячейка В-3

Объединение ячеек[править вики-текст]

В wiki-стиле, как и в HTML, имеется возможность объединять несколько ячеек как по вертикали, так и по горизонтали. Для объединения по вертикали применяется атрибут rowspan="n", где «n» — число ячеек, которые должна объединить данная ячейка. Этот атрибут вписывается перед содержанием объединяющей ячейки.

Пример:

Вертикальное объединение двух ячеек пишется так:         Выглядеть это будет так:
{| border="1"
 |Ячейка 1 
 |rowspan="2" |Ячейка 2, объединяет два ряда таблицы
 |Ячейка 3
 |- 
 |Ячейка 4
 |Ячейка 5
 |}
       
Ячейка 1 Ячейка 2, объединяет два ряда таблицы Ячейка 3
Ячейка 4 Ячейка 5
Для объединения по горизонтали используется атрибут colspan="n".         Выглядит это так:
{| border="1"
 |Ячейка 1 
 |colspan="2" |Ячейка 2, объединяет два столбца
 |-
 |Ячейка 3 
 |Ячейка 4
 |Ячейка 5
 |}
       
Ячейка 1 Ячейка 2, объединяет два столбца
Ячейка 3 Ячейка 4 Ячейка 5
Для создания сложного заголовка таблицы можно воспользоваться следующей конструкцией:         Выглядеть это будет так:
{| border="1"
|-
! rowspan="2" colspan="3" | Ячейка в две строки
! colspan="2" | Ячейка в два столбца
|-align="center"
| А || Б
|-align="center"
| 1 || 2 || 3 || 4 || 5
|-align="center"
| 1 || 2 || 3 || 4 || 5
|}
       
Ячейка в две строки Ячейка в два столбца
А Б
1 2 3 4 5
1 2 3 4 5


Вложенные таблицы[править вики-текст]

Основные принципы[править вики-текст]

Под вложенной таблицей подразумевается таблица, вложенная в какую-либо ячейку существующей, ранее созданной таблицы (родительская таблица). Написание кода вложенной таблицы подчиняется общим правилам для таблиц.

Для создания вложенной таблицы, надо найти в родительской таблице ячейку, в которую предполагается вложить таблицу, и с новой строки вписать код вложенной таблицы, открывая и закрывая вложенную таблицу фигурной скобкой, как при написании обычной таблицы.

Пример

Мы хотим в ячейке 2 родительской таблицы сделать вложенную таблицу.

Исходный код влож. табл.:   Исходный код родит. табл.:   В Википедии родит. табл. будет выглядеть так:
 {|
  |Ячейка A
  |-
  |Ячейка Б
  |-
  |Ячейка В
  |}
   
{| border="1"
 |Ячейка 1
 |Ячейка 2
 {|
  |Ячейка A
  |-
  |Ячейка Б
  |-
  |Ячейка В
  |}
 |Ячейка 3
 |}
   
Ячейка 1 Ячейка 2
Ячейка A
Ячейка Б
Ячейка В
Ячейка 3

Обратите внимание, что без указания параметров рамки (border="n") для вложенной таблицы, по умолчанию толщина линии рамки вложенной таблицы равна «1».

Объединённые таблицы[править вики-текст]

Основные принципы[править вики-текст]

Под объединённой таблицей понимается таблица, состоящая, как правило, из одной строки, в нечётных ячейках которой содержатся вложенные таблицы.

Посредством объединённой таблицы вы можете элегантно оформить данные в виде двух (или более) отдельных таблиц, расположенных рядом друг с другом в горизонтальном направлении, например:

Таблица 1
Ячейка 1.1
Ячейка 1.2
Ячейка 1.3
   
Таблица 2
Ячейка 2.1
Ячейка 2.2
Ячейка 2.3
   
Таблица 3
Ячейка 3.1
Ячейка 3.2
Ячейка 3.3

Для создания объединённой таблицы, показанной в примере выше, сначала напишите код объединённой таблицы из одной строки с пятью ячейками, которые будут служить столбцами объединённой таблицы:

{|
 |Столбец 1
 |Столбец 2
 |Столбец 3
 |Столбец 4
 |Столбец 5
 |}
   

Примечания

  • Столбец 1 — в этой ячейке будет вложенная таблица № 1.
  • Столбец 2 — эта ячейка будет служить пробелом между таблицами № 1 и 2.
  • Столбец 3 — в этой ячейке будет вложенная таблица № 2.
  • Столбец 4 — эта ячейка будет служить пробелом между таблицами № 2 и 3.
  • Столбец 5 — в этой ячейке будет вложенная таблица № 3.

Затем вместо записей «Столбец 2» и «Столбец 4» вставьте знак неразрывного пробела — &nbsp; — который установит расстояние между расположенными рядом таблицами. Если расстояние между таблицами вам покажется узковатым, добавьте один или более знаков неразрывного пробела, отделяя их друг от друга двумя вертикальными чёрточками, например:  || || || .

Исходный код объединённой таблицы:   В Википедии это будет выглядеть так:
{|
  |Столбец 1
  | || 
  |Столбец 3
  | || 
  |Столбец 5
  |}
   
Столбец 1     Столбец 3     Столбец 5

Затем в нечётные столбцы вместо записей «Столбец 1», «Столбец 2» и «Столбец 3» с новой строки впишите коды вложенных таблиц.

Исходный код объединённой таблицы:   В Википедии это будет выглядеть так:
{|
  |
  {| class="standard"
   !Таблица 1
   |-
   |Ячейка 1.1
   |-
   |Ячейка 1.2
   |-
   |Ячейка 1.3
   |}
  | || 
  |
  {| class="standard"
   !Таблица 2
   |-
   |Ячейка 2.1
   |-
   |Ячейка 2.2
   |-
   |Ячейка 2.3
   |}
  | || 
  |
  {| class="standard"
   !Таблица 3
   |-
   |Ячейка 3.1
   |-
   |Ячейка 3.2
   |-
   |Ячейка 3.3
   |}
  |}
   
Таблица 1
Ячейка 1.1
Ячейка 1.2
Ячейка 1.3
   
Таблица 2
Ячейка 2.1
Ячейка 2.2
Ячейка 2.3
   
Таблица 3
Ячейка 3.1
Ячейка 3.2
Ячейка 3.3

В объединённых таблицах можно располагать вложенные таблицы любой сложности и формата, а также делать объединённые таблицы многострочными. Однако следует учитывать, что с усложнением вложенных таблиц увеличивается сложность исходного кода и, соответственно, затрудняется его починка в случае неосторожного обращения при редактировании. Ниже приведён пример более сложных вложенных таблиц с заголовками и записью кода ячеек в одну строчку.

{|
 |
 {| class="standard"
  !Заголовок 1||Заголовок 2
  |-
  |Ячейка 1-1||Ячейка 1-2
  |-
  |Ячейка 1-3||Ячейка 1-4
  |-
  |Ячейка 1-5||Ячейка 1-6
  |-
  |Ячейка 1-7||Ячейка 1-8
  |-
  |Ячейка 1-9||Ячейка 1-10
  |-
  |Ячейка 1-11||Ячейка 1-12
  |}
 | || 
 |
 {| class="standard"
  !Заголовок 1||Заголовок 2
  |-
  |Ячейка 3-1||Ячейка 3-2
  |-
  |Ячейка 3-3||Ячейка 3-4
  |-
  |Ячейка 3-5||Ячейка 3-6
  |-
  |Ячейка 3-7||Ячейка 3-8
  |-
  |Ячейка 3-9||Ячейка 3-10
  |-
  |Ячейка 3-11||Ячейка 3-12
  |}
 | || 
 |
 {| class="standard"
  !Заголовок 1||Заголовок 2
  |-
  |Ячейка 5-1||Ячейка 5-2
  |-
  |Ячейка 5-3||Ячейка 5-4
  |-
  |Ячейка 5-5||Ячейка 5-6
  |-
  |Ячейка 5-7||Ячейка 5-8
  |-
  |Ячейка 5-9||Ячейка 5-10
  |-
  |Ячейка 5-11||Ячейка 5-12
  |}
 |}
       
Заголовок 1 Заголовок 2
Ячейка 1-1 Ячейка 1-2
Ячейка 1-3 Ячейка 1-4
Ячейка 1-5 Ячейка 1-6
Ячейка 1-7 Ячейка 1-8
Ячейка 1-9 Ячейка 1-10
Ячейка 1-11 Ячейка 1-12
   
Заголовок 1 Заголовок 2
Ячейка 3-1 Ячейка 3-2
Ячейка 3-3 Ячейка 3-4
Ячейка 3-5 Ячейка 3-6
Ячейка 3-7 Ячейка 3-8
Ячейка 3-9 Ячейка 3-10
Ячейка 3-11 Ячейка 3-12
   
Заголовок 1 Заголовок 2
Ячейка 5-1 Ячейка 5-2
Ячейка 5-3 Ячейка 5-4
Ячейка 5-5 Ячейка 5-6
Ячейка 5-7 Ячейка 5-8
Ячейка 5-9 Ячейка 5-10
Ячейка 5-11 Ячейка 5-12

Примерно такой же результат можно получить с помощью шаблона {{столбцы}} — см. его документацию.

Выравнивание объединённых таблиц[править вики-текст]

Объединяемые таблицы выравниваются по вертикали. Для выравнивания по верхнему краю таблиц с разным количеством строк применяется параметр style="vertical-align:top" или valign="top".

Пример без выравнивания

Таблица 1
Текст
Текст
Таблица 2
Текст
Таблица 3
Текст
Текст
Текст
Исходный код для примера без выравнивания
{|
|
{| class="wikitable"
 |-
 ! Таблица 1
 |-
 | Текст
 |-
 | Текст
 |}
|
{| class="wikitable"
 |-
 ! Таблица 2
 |-
 | Текст
 |}
|
{| class="wikitable"
 |-
 ! Таблица 3
 |-
 | Текст
 |-
 | Текст
 |-
 | Текст
|}
|}

Пример с выравниванием

Таблица 1
Текст
Текст
Таблица 2
Текст
Таблица 3
Текст
Текст
Текст
Исходный код для примера с выравниванием
{|
|valign="top"|
{| class="wikitable"
 |-
 ! Таблица 1
 |-
 | Текст
 |-
 | Текст
 |}
|valign="top"|
{| class="wikitable"
 |-
 ! Таблица 2
 |-
 | Текст
 |}
|valign="top"|
{| class="wikitable"
 |-
 ! Таблица 3
 |-
 | Текст
 |-
 | Текст
 |-
 | Текст
|}
|}

Ширина таблицы и столбцов[править вики-текст]

Если, например, подряд идут несколько отдельных таблиц, то желательно, чтобы ширина их была одинаковой, независимо от их содержания. Для фиксации ширины таблицы применяется атрибут width.

Пример:
{| border="1" width="75%"
 |+Таблица 1
 |Ячейка 1*1 - long - long- long- long- long
 |Ячейка 1*2
 |-
 |Ячейка 1*3
 |Ячейка 1*4
 |}
{| border="1" width="75%"
 |+Таблица 2
 |Ячейка 2*1
 |Ячейка 2*2
 |-
 |Ячейка 2*3
 |Ячейка 2*4
 |}

Выглядеть это будет так:

Таблица 1
Ячейка 1*1 - long - long- long- long- long Ячейка 1*2
Ячейка 1*3 Ячейка 1*4
Таблица 2
Ячейка 2*1 Ячейка 2*2
Ячейка 2*3 Ячейка 2*4

С помощью этого же атрибута можно регулировать ширину отдельных столбцов:

Пример:
{| border="1" width="75%"
 |+Таблица 1
 | width="40%"|Ячейка 1*1 - long - long- long- long- long
 | width="20%"|Ячейка 1*2 - long - long- long- long- long
 | width="40%"|Ячейка 1*3 - long - long- long- long- long
 |-
 |Ячейка 1*4
 |Ячейка 1*5
 |Ячейка 1*6
 |}
Таблица 1
Ячейка 1*1 - long - long- long- long- long Ячейка 1*2 - long - long- long- long- long Ячейка 1*3 - long - long- long- long- long
Ячейка 1*4 Ячейка 1*5 Ячейка 1*6

Для задания определённой ширины ячейки с вложенной таблицей следует указать для неё атрибут width, но закрыть этот атрибут вертикальной чёрточкой:

{| border="1"
 |Ячейка 1
 | width="50%"|
 {| border="2"
  |Ячейка A
  |-
  |Ячейка B
  |}
 |Ячейка 3
 |}
       
Ячейка 1
Ячейка A
Ячейка B
Ячейка 3

Сворачивающиеся и сортируемые таблицы[править вики-текст]

При использовании таблиц может оказаться полезным не загромождать ими статью, но в то же время дать в них всю необходимую и полезную информацию (которая може быть интересна не всем читателям). Для этого можно использовать сворачивающиеся таблицы указав, что они по умолчанию должны показываться в свёрнутом состоянии.

{| class="wikitable collapsible collapsed"
|-
! Заголовок таблицы
|-
| Содержание таблицы (остающееся по умолчанию скрытым)
|-
| Продолжение скрытого содержания
|}

Получаем:

Если не указать collapsed, то таблица будет сворачивающейся, но по умолчанию — развёрнутой.

Также можно сделать таблицу такой, что её содержание будет сортироваться (по вертикали), включив в заголовок команду «sortable», причём сортировка может проводиться по любому из столбцов, выбранному читателем. Такие сортируемые таблицы могут одновременно быть сворачивающимися. При этом нужно учесть следующее:

  • Не следует делить таблицу на секции с помощью заголовков секций (или чего-то схожего), занимающего несколько ячеек (объединённых).
  • Если в ячейке находятся числа, то для успешной сортировки таких ячеек необходимо, чтобы перед числами не было никаких буквенных пояснений — «Номер», «Около», «для N>5» — содержимое ячейки должно начинаться с сортируемых цифр. Кроме того, для корректной сортировки столбцов чисел, содержащих нецифровые символы, нужно дать движку указание на необходимость применения числовой сортировки, проставив в мета-заголовке столбца data-sort-type="number".
{| class="wikitable collapsible sortable"
|-
! Числа !! Буквы !! Числа и буквы после них
|-
| 1 || в || 90 млн  
|-
| 3 || а || 5 десятков  
|-
| 2 || б || 10 тыс 
|}

Получаем:

Числа Буквы Числа и буквы после них
1 в 90 млн
3 а 5 десятков
2 б 1 тыс.

Вариант той же таблицы, по умолчанию свёрнутой:

Более подробно работа разных видов сворачивающихся и сортируемых таблиц описана в исходном тексте помощи в Английской Википедии: сворачивание; сортировка.

Ограничения[править вики-текст]

Для создания PDF в каждой ячейке таблицы должно быть строк не более чем вмещается на одну отрисованную страницу (примерно до 60 строк), иначе PDF сформируется некорректно.

См. также[править вики-текст]

Ссылки[править вики-текст]

↱ ВП:КОНВЕРТЕР