Просмотр кода страницы Wiki12:Таблицы

{{Shortcut|ВП:Т|ВП:ТАБ}}
'''Таблица''' — форма представления информации, облегчающая её визуальное восприятие. Состоит из строк, столбцов и ячеек.

== Исходный код ==

=== Начальный пример ===
{{demo|tag=pre|br=Результат:|<nowiki>
{| class="wikitable"
|+ Заголовок таблицы (название)
|-
! <!-- Пустая ячейка --> !! Заголовок столбца 1 !! Заголовок столбца 2
|-
! Заголовок строки 1 
| Содержимое ячейки 1-1 || Содержимое ячейки 1-2
|-
! Заголовок строки 2 
| Содержимое ячейки 2-1 || Содержимое ячейки 2-2
|}
</nowiki>}}

=== Элементы ===
{| class="wikitable"
|-
! Код !! Функция !! Примечания
|-
| style="font-size:18px; text-align:center; " | <code><nowiki>{|</nowiki></code> || class="shadow" | Начало кода таблицы || После него можно указать класс таблицы и параметры её оформления (стиль). Пример:<br><code><nowiki>{| class="..." style="...; ...; "</nowiki></code>
|-
| style="font-size:18px; text-align:center; " | <code><nowiki>|+</nowiki></code> || class="shadow" | Заголовок таблицы || Располагается в следующей строчке кода таблицы после его начала. Пример:<pre>{| 
|+ Название таблицы</pre>
Не стоит использовать для этих целей другие элементы, они не обозначают заголовок таблицы в той же мере.

''Если заголовок не нужен, то размещать его код необязательно. Подробнее [[#Заголовки таблиц|здесь]].''
|-
| style="font-size:18px; text-align:center; " | <code><nowiki>|-</nowiki></code> || class="shadow" | Разделитель строк
|
{| style="float:right; margin-left:0.8em; "
|
<pre>|- style="...; ...; "
| Ячейка 1-1 || Ячейка 1-2
|-
| Ячейка 2-1 || Ячейка 2-2</pre>
|}
После него можно указать стиль сразу для всех ячеек, входящих в следующую строку. На приведённом примере стиль применится для ячеек 1-1 и 1-2:
|-
| style="font-size:18px; text-align:center; " | <code><nowiki>!</nowiki></code> || class="shadow" | Начало ячейки заголовка столбца || Начало первой ячейки в строке заголовков столбцов при горизонтальном расположении кода и начало всех ячеек заголовков при вертикальном расположении кода. Примеры аналогичны примерам элемента <code><nowiki>|</nowiki></code> (начало ячейки), только вместо него будет <code><nowiki>!</nowiki></code>
''Заголовки столбцов оформляются при необходимости. Подробнее [[#Заголовки столбцов|здесь]].''
|-
| style="font-size:18px; text-align:center; " | <code><nowiki>!!</nowiki></code> || class="shadow" | Разделитель ячеек заголовков столбцов || Используется при горизонтальном оформлении кода. Пример:<br><code><nowiki>! Столбец 1 !! Столбец 2 !! Столбец 3</nowiki></code>
|-
| style="font-size:18px; text-align:center; " | <code><nowiki>|</nowiki></code>
| class="shadow" |
* Начало ячейки
* Разделитель параметров ячейки
|
* Начало первой ячейки в строке при горизонтальном расположении кода и начало любой ячейки при вертикальном расположении кода. Примеры:<br><code><nowiki>| Ячейка 1 || Ячейка 2 || Ячейка 3</nowiki></code> {{pre|<nowiki>
| Ячейка 1
| Ячейка 2
| Ячейка 3</nowiki>}}
* Параметры отдельной ячейки указываются сразу после знаков <code><nowiki>!</nowiki></code>, <code><nowiki>!!</nowiki></code>, <code><nowiki>|</nowiki></code>, <code><nowiki>||</nowiki></code>, и в конце параметры закрываются знаком <code><nowiki>|</nowiki></code>. Пример:<br><code><nowiki>| style="...; ...; " | Ячейка 1 || colspan="2" | Ячейка 2-3</nowiki></code>
|-
| style="font-size:18px; text-align:center; " | <code><nowiki>||</nowiki></code> || class="shadow" | Разделитель ячеек || Используется при горизонтальном оформлении кода. Пример см. выше.
|-
| style="font-size:18px; text-align:center; " | <code><nowiki>|}</nowiki></code> || class="shadow" | Окончание кода таблицы || Пример:<pre>| Ячейка 1 || Ячейка 2
|}</pre>
|}

==== Классы ====
Имеется несколько возможных классов для оформления таблицы: <code>wikitable</code>, <code>standard</code>, <code>wide</code>.
{| class="wikitable"
|+ Таблица <code>wikitable</code>
! <!-- Пустая ячейка --> !! Заголовок столбца 1 !! Заголовок столбца 2
|-
| Заголовок строки 1 || Содержимое ячейки 1-1 || Содержимое ячейки 1-2
|-
| Заголовок строки 2 || Содержимое ячейки 2-1 || Содержимое ячейки 2-2
|}

{| class="standard"
|+ Таблица <code>standard</code>
! <!-- Пустая ячейка --> !! Заголовок столбца 1 !! Заголовок столбца 2
|-
| Заголовок строки 1 || Содержимое ячейки 1-1 || Содержимое ячейки 1-2
|-
| Заголовок строки 2 || Содержимое ячейки 2-1 || Содержимое ячейки 2-2
|}

{| class="wide"
|+ Таблица <code>wide</code>
! <!-- Пустая ячейка --> !! Заголовок столбца 1 !! Заголовок столбца 2
|-
|Заголовок строки 1 || Содержимое ячейки 1-1 || Содержимое ячейки 1-2
|-
|Заголовок строки 2 || Содержимое ячейки 2-1 || Содержимое ячейки 2-2
|}

=== Вертикальное и горизонтальное оформление ===
Оформление кода разное, результат одинаковый:
{|
|- style="vertical-align:top;"
| <pre>
{| class="wikitable"
! Столбец 1
! Столбец 2
! Столбец 3
|-
| Ячейка 1-1
| Ячейка 1-2
| Ячейка 1-3
|-
| Ячейка 2-1
| Ячейка 2-2
| Ячейка 2-3
|}</pre>
| style="padding:0.2em 0.8em 0.2em 0.6em;" |
<pre>{| class="wikitable"
! Столбец 1 || Столбец 2 || Столбец 3
|-
| Ячейка 1-1 || Ячейка 1-2 || Ячейка 1-3
|-
| Ячейка 2-1 || Ячейка 2-2 || Ячейка 2-3
|}</pre>
|
{| class="wikitable"
! Столбец 1 || Столбец 2 || Столбец 3
|-
| Ячейка 1-1 || Ячейка 1-2 || Ячейка 1-3
|-
| Ячейка 2-1 || Ячейка 2-2 || Ячейка 2-3
|}
|}

== Пример таблицы с описанием параметров ==
Образец таблицы с использованием класса <code>wikitable</code>:
{{demo|tag=pre|br=|<nowiki>
{| class="wikitable"
|+ Название таблицы
|-
! Заголовок 1 !! Заголовок 2
|-
| Ячейка 1 || Ячейка 2
|-
| Ячейка 3 || Ячейка 4
|}
</nowiki>}}

Аналогичная по оформлению таблица без класса <code>wikitable</code>:
{{demo|tag=pre|reverse=1|br=|<nowiki>
{| style="background:var(--background-color-neutral-subtle, #f8f9fa); color:inherit; border:1px solid var(--border-color-base, #a2a9b1); border-collapse:collapse; margin-top:1.0em; margin-bottom:1.0em;"
|+ Название таблицы
|- style="border-bottom:1px solid var(--border-color-base, #a2a9b1); background:var(--background-color-neutral, #eaecf0); color:inherit;"
! style="border-right:1px solid var(--border-color-base, #a2a9b1); padding:0.2em 0.4em 0.2em 0.4em;" | Заголовок 1
! style="padding:0.2em 0.4em 0.2em 0.4em;" | Заголовок 2
|- style="border-bottom:1px solid var(--border-color-base, #a2a9b1);"
| style="border-right:1px solid var(--border-color-base, #a2a9b1); padding:0.2em 0.4em 0.2em 0.4em;" | Ячейка 1
| style="padding:0.2em 0.4em 0.2em 0.4em;" | Ячейка 2
|-
| style="border-right:1px solid var(--border-color-base, #a2a9b1); padding:0.2em 0.4em 0.2em 0.4em;" | Ячейка 3
| style="padding:0.2em 0.4em 0.2em 0.4em;" | Ячейка 4
|}
</nowiki>}}

'''Описание параметров'''

В заголовке кода таблицы:
* <code>background: var(--background-color-neutral-subtle, #f8f9fa);</code> — цвет фона ячеек.
* <code>border: 1px solid var(--border-color-base, #a2a9b1);</code> — граница вокруг таблицы толщиной 1 пиксель в виде непрерывной линии и цветом #a2a9b1.
* <code>border-collapse: collapse;</code> — одна общая граница между ячейками.
* <code>margin-top: 1.0em; margin-bottom:1.0em;</code> — отступы от таблицы сверху и снизу (поля).

Для отдельных ячеек:
* <code>border-bottom: 1px solid var(--border-color-base, #a2a9b1);</code> — нижняя граница заголовков 1 и 2 (аналогично для ячеек 1-2).
* <code>background: var(--background-color-neutral, #eaecf0);</code> — цвет фона заголовков 1 и 2.
* <code>border-right: 1px solid var(--border-color-base, #a2a9b1);</code> — правая граница заголовка 1, общая с заголовком 2 (аналогично для ячеек 1, 3).
* <code>padding: 0.2em 0.4em 0.2em 0.4em;</code> — отступы от верхней, правой, нижней и левой границы заголовка 1 (аналогично для всех остальных ячеек).

'''Избегайте собственноручной стилизации таблиц по возможности.'''

== Заголовки ==
{{Якорь|Заголовки таблиц}}

=== Заголовок таблицы ===
{{demo|tag=pre|reverse=1|br=|<nowiki>
{| class="wikitable"
|-
| Без заголовка
|}
</nowiki>}}
----
{{demo|tag=pre|reverse=1|br=|<nowiki>
{| class="wikitable"
|+ С заголовком
|-
| Содержимое ячейки
|}
</nowiki>}}
----
{{demo|tag=pre|reverse=1|br=|<nowiki>
{| class="wikitable"
|+ style="caption-side:bottom; padding-top:0.6em; text-align:left; font-weight:normal; font-size:85%; line-height:1.5;" | Заголовок таблицы размещён внизу таблицы, с увеличенным отступом от неё, выравниванием слева, нормальной насыщенностью (нежирный), уменьшенным размером и расстоянием между строк (интерлиньяжем)
|-
| Содержимое ячейки
|}
</nowiki>}}

=== Заголовки столбцов ===
{{demo|tag=pre|reverse=1|br=|<nowiki>
{| class="wikitable"
|-
| Без заголовка || Без заголовка
|}
</nowiki>}}
----
{{demo|tag=pre|reverse=1|br=|<nowiki>
{| class="wikitable"
|-
! Заголовок 1 !! Заголовок 2
|-
| Содержимое ячейки 1 || Содержимое ячейки 2
|}
</nowiki>}}
----
{{demo|tag=pre|reverse=1|br=|<nowiki>
{| class="wikitable"
|-
! style="font-weight:normal;" | Заголовок 1 !! style="font-weight:normal;" | Заголовок 2
|-
| Содержимое ячейки 1 || Содержимое ячейки 2
|}
</nowiki>}}

=== Заголовки строк ===
{{demo|tag=pre|reverse=1|br=|<nowiki>
{| class="wikitable"
|-
! {{по диагонали|Боковики|Заголовки|5em}} !! Заголовок 1 !! Заголовок 2
|-
! Боковик 1
| Содержимое ячейки 1 || Содержимое ячейки 2
|-
! Боковик 2
| Содержимое ячейки 3 || Содержимое ячейки 4
|}
</nowiki>}}

== Таблица с сортировкой данных в столбце ==
{{Якорь|Таблица с сортировкой данных в столбце}}

{{demo|tag=pre|reverse=1|br=|<nowiki>
{| class="wikitable sortable" 
|-
! Столбец 
|-
| 1
|-
| 2
|-
| 3
|}
</nowiki>}}

== Выравнивание ==

=== Выравнивание содержимого по горизонтали ===
Можно указать выравнивание влево, вправо и по центру отдельных ячеек, целых строк и таблицы в целом:
{{demo|tag=pre|reverse=1|br=|<nowiki>
{| class="wikitable"
|-
| style="text-align:left;" | текст '''слева'''
|-
| style="text-align:right;" | текст '''справа'''
|-
| style="text-align:center;" | текст '''посередине'''
|}
</nowiki>}}
{{demo|tag=pre|reverse=1|br=|<nowiki>
{| class="wikitable"
|- style="text-align:left;" 
| текст '''слева'''
| текст '''слева'''
| текст '''слева'''
|- style="text-align:right;"
| текст '''справа'''
| текст '''справа'''
| текст '''справа'''
|- style="text-align:center;" 
| текст '''посередине'''
| текст '''посередине'''
| текст '''посередине'''
|}
</nowiki>}}
{{demo|tag=pre|reverse=1|br=|<nowiki>
{| class="wikitable" style="text-align:center;"
|-
| текст '''посередине'''
|-
| текст<br>'''посередине'''
|-
| текст '''посередине'''
|}
</nowiki>}}

Указать выравнивание для отдельных целых столбцов подобным образом нельзя, но существуют шаблоны {{tlx|Table alignment}} и {{tlx|Стиль столбцов}}, упрощающие создание таблиц с разным выравниванием по горизонтали в разных столбцах.

=== Выравнивание содержимого по вертикали ===
{{demo|tag=pre|reverse=1|br=|<nowiki>
{| class="wikitable"
| текст посередине<br>текст посередине
| style="vertical-align:middle;" | текст '''посередине'''
| style="vertical-align:top;" | текст '''сверху'''
| style="vertical-align:bottom;" | текст '''снизу'''
|}
</nowiki>}}
{{demo|tag=pre|reverse=1|br=|<nowiki>
{| class="wikitable"
|- style="vertical-align:top;"
| текст<br>'''сверху'''
| текст '''сверху'''
| текст '''сверху'''
| текст<br>'''сверху'''
|}
</nowiki>}}

=== Выравнивание таблицы и её обтекание ===
''Примечание:'' параметр <code>clear</code> в заголовке кода таблицы запрещает ей обтекать изображения и другие таблицы. Во многих случаях в нём нет необходимости (можно убрать).
{| class="wikitable"
|-
! Слева без обтекания
|-
| style="padding:0;" |
<pre>{| class="wikitable" style="clear:left;"
|-
| Текст ячейки
|}</pre>
|}
Текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст.
----
{| class="wikitable" style="float:left; margin-right:0.8em;"
|-
! Слева с обтеканием
|-
| style="padding:0;" |
<pre>{| class="wikitable" style="float:left; margin-right:0.8em; clear:left;"
|-
| Текст ячейки
|}</pre>
|}
Текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст.
<div style="clear:both;"></div>
----
{| class="wikitable" style="float:right;"
|-
! Справа без обтекания
|-
| style="padding:0;" |
<pre>{| class="wikitable" style="float:right; clear:right;"
|-
| Текст ячейки
|}<div style="clear:both;"></div></pre>
|}<div style="clear:both;"></div>
Текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст.
----
{| class="wikitable" style="float:right; margin-left:0.8em;"
|-
! Справа с обтеканием
|-
| style="padding:0;" |
<pre>{| class="wikitable" style="float:right; margin-left:0.8em; clear:right;"
|-
| Текст ячейки
|}</pre>
|}
Текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст.
<div style="clear:both;"></div>
----
{| class="wikitable" style="margin:auto"
|-
! Посередине без обтекания
|-
| style="padding:0;" |
<pre>{| class="wikitable" style="margin:auto; clear:both;"
|-
| Текст ячейки
|}</pre>
|}
Текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст.

== Несколько таблиц рядом ==
'''Слева'''
{| class="wikitable" style="float:left; margin-right:1.4em; clear:left;"
|-
| Таблица 1
|}
{| class="wikitable" style="float:left; margin-right:1.4em;"
|-
| Таблица 2
|-
| Таблица 2
|}
{| class="wikitable" style="float:left;"
|-
| Таблица 3
|-
| Таблица 3
|-
| Таблица 3
|}
{{clear}}
''Примечание:'' чтобы добавить обтекание группы таблиц текстом, необходимо в конце последней таблицы удалить {{tl|clear}} и добавить к ней отступ как у первых двух таблиц (<code>margin-right:1.4em;</code>).
<pre>{| class="wikitable" style="float:left; margin-right:1.4em; clear:left;"
|-
| Таблица 1
|}

{| class="wikitable" style="float:left; margin-right:1.4em;"
|-
| Таблица 2
|-
| Таблица 2
|}

{| class="wikitable" style="float:left;"
|-
| Таблица 3
|-
| Таблица 3
|-
| Таблица 3
|}
{{clear}}</pre>

{{^|1em}}
'''Справа'''

Исходный код в целом соответствует примеру выше, только необходимо поменять <code>float:left</code> на <code>float:right</code>, <code>margin-right</code> на <code>margin-left</code> и <code><nowiki>clear:left</nowiki></code> на <code><nowiki>clear:right</nowiki></code>.

== Списки в таблице ==
Маркированный или нумерованный список начинается с новой строчки кода:
{{demo|tag=pre|br=|<nowiki>
{| class="wikitable"
|-
| ячейка 1 ||
* раз
* два
* три
|-
| ячейка 3 ||
* раз
* два
* три
|}
</nowiki>}}

== Объединение ячеек ==
Горизонтальное (объединение столбцов)
{{demo|tag=pre|reverse=1|br=|<nowiki>
{| class="wikitable"
| Ячейка 1 || Ячейка 2 || Ячейка 3
|-
| colspan="2" | Ячейка 4-5 || Ячейка 6
|-
| Ячейка 7 || colspan="2" | Ячейка 8-9
|-
| colspan="3" | Ячейка 10-11-12
|}
</nowiki>}}
----
Вертикальное (объединение строк)
{{demo|tag=pre|reverse=1|br=|<nowiki>
{| class="wikitable"
| Ячейка 1 || Ячейка 2
|-
| rowspan="2" | Ячейка 3-5 || Ячейка 4
|-
| Ячейка 6
|}
</nowiki>}}
----
Одновременное (объединение как строк, так и столбцов)
{{demo|tag=pre|reverse=1|br=|<nowiki>
{| class="wikitable"
| Ячейка 1 || Ячейка 2 || Ячейка 3
|-
| Ячейка 4 || colspan="2" rowspan="2" | Ячейка 5-6-8-9
|-
| Ячейка 7  
|}
</nowiki>}}

== Цвета ==

Для задания цвета используется атрибут ''style'', с помощью которого можно задавать цвет как текста (<code>style=color:#RRGGBB;</code>), так и фона (<code>style=background-color:#RRGGBB;</code>), где ''#RRGGBB'' — [[Шестнадцатеричная система счисления|шестнадцатеричный]] код цвета. Вместо шестнадцатеричной кодировки можно использовать названия цветов.
{{см. также|ВП:ЦВЕТ|Википедия:Таблица цветов}}

=== Цвет фона ===
Меняя расположение атрибута ''style'', можно задавать цвет фона как отдельных ячеек, так и целых строк.
{{demo|tag=pre|reverse=1|br=|<nowiki>
{| class="wikitable"
!стандартный фон
! style="background-color:ivory;" | нестандартный фон
!стандартный фон
|-
|стандартный фон
| style="background-color:red;" | красный
|стандартный фон
|-
|стандартный фон
| style="background-color:yellow;" | жёлтый
|стандартный фон
|-
|стандартный фон
| style="background-color:green;" | зелёный
|стандартный фон
|}
</nowiki>}}
{{demo|tag=pre|reverse=1|br=|<nowiki>
{| class="wikitable"
|-
| стандартный фон
| стандартный фон
|-
| стандартный фон
| стандартный фон
|- style="background-color:yellow;"
| меняем фон нижней строки
| меняем фон нижней строки
|}
</nowiki>}}

Можно поменять цвет фона и таблицы в целом, разместив атрибут ''style'' в её шапке. Однако при этом заголовок сохраняет стандартный фон.
{{demo|tag=pre|reverse=1|br=|<nowiki>
{| class="wikitable" style="background-color:red;"
! заголовок
|-
| текст
|-
| текст
|-
| текст
|}
</nowiki>}}

=== Цвет текста ===
Можно задавать цвет текста как для отдельных ячеек, так и для целых строк.
{{demo|tag=pre|reverse=1|br=|<nowiki>
{| class="wikitable"
!стандартный цвет
! style="color:brown;" | нестандартный цвет
!стандартный цвет
|-
|стандартный цвет
| style="color:red;" | красный
|стандартный цвет
|-
|стандартный цвет
| style="color:yellow;" | жёлтый
|стандартный цвет
|-
|стандартный цвет
| style="color:green;" | зелёный
|стандартный цвет
|}
</nowiki>}}
{{demo|tag=pre|reverse=1|br=|<nowiki>
{| class="wikitable"
|- style="color:red;"
! меняем цвет заголовка
! меняем цвет заголовка
|-
| обычный цвет текста
| обычный цвет текста
|-
| обычный цвет текста
| обычный цвет текста
|- style="color:blue;"
| меняем цвет текста в нижней строке
| меняем цвет текста в нижней строке
|}
</nowiki>}}

Можно задавать цвет текста для всей таблицы, разместив атрибут ''style'' в её шапке.
{{demo|tag=pre|reverse=1|br=|<nowiki>
{| class="wikitable" style="color:red;"
! заголовок
|-
| текст
|-
| текст
|-
| текст
|}
</nowiki>}}

Можно задавать цвет отдельных слов в ячейке.
{{demo|tag=pre|reverse=1|br=|<nowiki>
{| class="wikitable"
|-
| Текст <span style="color:#f00;">ячейки Текст</span> ячейки
|}
</nowiki>}}

'''Примечание:''' этот метод годится и тогда, когда текст не размещён в таблице.
{{demo|tag=pre|reverse=1|br=|<nowiki>
<span style="color:red">Красный,</span> <span style="color:yellow">жёлтый,</span>, <span style="color:green">зелёный.</span>
</nowiki>}}

== Размер шрифта ==
{{см. также|ВП:РТ}}
Размер шрифта следует задавать в процентах от нормального. (Технически возможно, но нежелательно задавать его в следующих единицах: em, ex, pt, px.) [[ВП:РТ|Размер шрифта не должен быть меньше 85 %]]. ''Примечание:'' при указании единицы измерения, включая проценты, пробел между ней и числом недопустим (<code>95%</code>). 

Без изменения размера:
<code><nowiki>{| class="wikitable"</nowiki></code>
{| class="wikitable"
|-
! Столбец !! Столбец
|-
| Текст ячейки || Текст ячейки
|-
| Текст ячейки || Текст ячейки
|}
----
С размером шрифта 85 % во всех ячейках таблицы:
<code><nowiki>{| class="wikitable" style="font-size:85%;"</nowiki></code>
{| class="wikitable" style="font-size:85%;"
|-
! Столбец !! Столбец
|-
| Текст ячейки || Текст ячейки
|-
| Текст ячейки || Текст ячейки
|}
----
Отдельных ячеек:
{{demo|tag=pre|reverse=1|br=|<nowiki>
{| class="wikitable"
|-
| style="font-size:120%;" | Текст ячейки 1
|-
| Текст ячейки 2
|-
| style="font-size:110%;" | Текст ячейки 3
|-
| style="font-size:85%;" | Текст ячейки 4
|}
</nowiki>}}

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

{{^|1em}}
'''Скрытие отдельных границ между ячейками'''
{{demo|tag=pre|reverse=1|br=|<nowiki>
{| class="wikitable"
|- style="border-bottom:hidden;"
| Ячейка 1 || Ячейка 2
|-
| Ячейка 3 || Ячейка 4
|}
{| class="wikitable"
|-
| style="border-right:hidden;" | Ячейка 1 || Ячейка 2
|-
| style="border-right:hidden;" | Ячейка 3 || Ячейка 4
|}
</nowiki>}}

== Ширина таблицы и столбцов ==
Указывается в %, em. Не следует указывать в px.
{{demo|tag=pre|reverse=1|br=|<nowiki>
{| class="wikitable" style="width:100%;"
|-
| Таблица на всю ширину страницы
|}
{| class="wikitable" style="width:50%;"
|-
| Таблица на половину ширины страницы
|}
{| class="wikitable" style="width:25%;"
|-
| Таблица на четверть ширины страницы
|}
</nowiki>}}
----
{{demo|tag=pre|reverse=1|br=|<nowiki>
{| class="wikitable" style="width:50%;"
|-
| style="width:50%;" | Эта ячейка (столбец) занимает половину ширины таблицы || style="width:25%; " | Эта ячейка занимает четверть ширины таблицы || Ширина всей таблицы равна половине ширины страницы
|}
</nowiki>}}

== Виды таблиц ==

=== Стандартная ===
{|
|- style="vertical-align:top;"
| style="padding-right:1.4em;" |
{| class="wikitable"
|-
! Столбец 1 || Столбец 2
|-
| Ячейка 1-1 || Ячейка 1-2
|-
| Ячейка 2-1 || Ячейка 2-2
|}
| <pre>
{| class="wikitable"
|-
! Столбец 1 || Столбец 2
|-
| Ячейка 1-1 || Ячейка 1-2
|-
| Ячейка 2-1 || Ячейка 2-2
|}</pre>
|}

=== Сортируемая ===
У такой таблицы заголовки столбцов обязательны. Полную документацию см. в [[:m:Help:Sorting]].
{| class="wikitable sortable"
|-
! Алфавит !! Числа !! С указанием ключа сортировки !! class="unsortable" | Несортируемый столбец
|-
| А || 2 млрд || data-sort-value="2000000000" | 2 млрд || A
|-
| Б || 3 || 3 || B
|-
| В || 4 тыс. || data-sort-value="4000" | 4 тыс. || C
|-
| Г || 1 млн || data-sort-value="1000000" | 1 млн || D
|- <!-- ЭТО НЕСОРТИРУЕМАЯ СТРОКА -->
! Итог !! 2 001 004 003 !! 2 001 004 003 !! —
|}
<pre>{| class="wikitable sortable"
|-
! Алфавит !! Числа !! С указанием ключа сортировки !! class="unsortable" | Несортируемый столбец
|-
| А || 2 млрд || data-sort-value="2000000000" | 2 млрд || A
|-
| Б || 3 || 3 || B
|-
| В || 4 тыс. || data-sort-value="4000" | 4 тыс. || C
|-
| Г || 1 млн || data-sort-value="1000000" | 1 млн || D
|- <!-- ЭТО НЕСОРТИРУЕМАЯ СТРОКА -->
! Итог !! 2 001 004 003 !! 2 001 004 003 !! —
|}</pre>

Для правильной сортировки по столбцу с числами можно добавить в заголовок столбца <code><nowiki>data-sort-type="number"</nowiki></code>, получится <code><nowiki>! data-sort-type="number" | Заголовок</nowiki></code>.

=== Сворачиваемая ===
У такой таблицы заголовки столбцов обязательны.

Изначально развёрнутая
<code><nowiki>class="wikitable mw-collapsible"</nowiki></code>
{| class="wikitable mw-collapsible"
|-
! Столбец !! Столбец
|-
| ячейка || ячейка
|-
| ячейка || ячейка
|}
Изначально свёрнутая
<code><nowiki>class="wikitable mw-collapsible mw-collapsed"</nowiki></code>
{| class="wikitable mw-collapsible mw-collapsed"
|-
! Столбец !! Столбец
|-
| ячейка || ячейка
|-
| ячейка || ячейка
|}

=== Примеры их комбинации ===
{| class="wikitable sortable mw-collapsible mw-collapsed" style="font-size:85%; width:75%;"
|+ Название таблицы
|-
! Алфавит !! Числа !! С указанием ключа сортировки !! class="unsortable" | Несортируемый столбец
|-
| А || 2 млрд || data-sort-value="2000000000" | 2 млрд || A
|-
| Б || 3 || 3 || B
|-
| В || 4 тыс. || data-sort-value="4000" | 4 тыс. || C
|-
| Г || 1 млн || data-sort-value="1000000" | 1 млн || D
|-
! Итог !! 2 001 004 003 !! 2 001 004 003 !! —
|}
<pre>{| class="wikitable sortable mw-collapsible mw-collapsed" style="font-size:85%; width:75%;"
|+ Название таблицы
...</pre>

== См. также ==
* [[:mediawikiwiki:Help:Tables/ru|Справка по редактированию таблиц]] на MediaWiki
* [[Википедия:Колонки]]
* [[Шаблон:Шаблоны ячеек таблицы|Шаблоны ячеек таблицы]]
* Шаблон {{t|float right}}
* Шаблоны {{tl|НумерацияТаблицы}} и {{tl|Автонумерация}} для автоматической нумерации и сортировки строк таблицы
* Шаблон {{t|Плавающая шапка таблицы}}
* Шаблон {{tl|Стиль столбцов}}

== Ссылки ==
* [https://exogens.ru/on-line-instrumenty/wiki-tablicy/ Конвертер таблиц Excel, Word, OpenOffice в вики-таблицы]
* [http://wang.wustl.edu/mediawiki/extensions/index.php Copy & Paste Excel-to-Wiki Converter] {{недоступная ссылка}}
* https://tools.wmflabs.org/excel2wiki/index.php 
* http://www.hifi-remote.com/excel2wiki/
* [https://www.tablesgenerator.com/mediawiki_tables Конструктор таблиц]

[[Категория:Википедия:Способы оформления статей]]