При редактировании в режиме Исходного кода таблицу можно добавить, используя следующие элементы викитекста :
Описание
Викитекст
Начало таблицы (<table>
)
{|
Начало строки таблицы (<tr>
)
|-
Заглавная ячейка (<th>
), если необходима: последовательность заглавных ячеек можно записывать на одной строке с двойными разделителями (!!
) или начинать с новой строки, каждую со своим знаком (!
).
!
или !!
Обычная ячейка (<td>
): последовательность ячеек можно записывать на одной строке с двойными разделителями (||
) или начинать с новой строки, каждую со своим знаком (|
).
|
или ||
Конец таблицы (</table>
)
|}
Примечание . HTML-код, закрывающий теги для строк (</tr>
), заголовков (</th>
) или ячеек (</td>
), будет добавлен автоматически.
Примеры викитекста для создания таблиц [ ]
Простые таблицы [ ]
Ниже можно увидеть варианты викитекста для создания простых таблиц:
Описание
Викитекст
Результат
Таблица с одной ячейкой
{| border="1"
|-
|
строка 1, ячейка/колонка 1
|}
строка 1, ячейка/колонка 1
Таблица с двумя ячейками; левая ячейка выделена как заглавная
{| border="1"
|-
!
строка 1, <br>
заголовок 1/колонка 1
|
строка 1, <br>
ячейка 1/колонка 2
|}
строка 1, заголовок 1/колонка 1
строка 1, ячейка 1/колонка 2
Таблица с двумя ячейками и заголовком
{| border="1"
|-
|+ Заголовок
!
строка 1, колонка 1
|
строка 1, колонка 2
|}
Заголовок
строка 1, колонка 1
строка 1, колонка 2
Таблица с тремя колонками и тремя строками
{| border="1"
|-
|
строка 1, <br>
ячейка/колонка 1
|
строка 1, <br>
ячейка/колонка 2
|
строка 1, <br>
ячейка/колонка 3
|-
|
строка 2, <br>
ячейка/колонка 1
|
строка 2, <br>
ячейка/колонка 2
|
строка 2, <br>
ячейка/колонка 3
|-
|
строка 3, <br>
ячейка/колонка 1
|
строка 3, <br>
ячейка/колонка 2
|
строка 3, <br>
ячейка/колонка 3
|}
строка 1, ячейка/колонка 1
строка 1, ячейка/колонка 2
строка 1, ячейка/колонка 3
строка 2, ячейка/колонка 1
строка 2, ячейка/колонка 2
строка 2, ячейка/колонка 3
строка 3, ячейка/колонка 1
строка 3, ячейка/колонка 2
строка 3, ячейка/колонка 3
Таблица с двумя строками и двумя колонками; ширина таблицы 90% от ширины страницы
{| width="90%" border="1"
|-
|
строка 1, <br>
ячейка/колонка 1
|
строка 1, <br>
ячейка/колонка 2
|-
|
строка 2, <br>
ячейка/колонка 1
|
строка 2, <br>
ячейка/колонка 2
|}
Рамка приведена только в качестве иллюстрации.
строка 1, ячейка/колонка 1
строка 1, ячейка/колонка 2
строка 2, ячейка/колонка 1
строка 2, ячейка/колонка 2
Таблица с двумя строками и двумя колонками; в нижней строке текст с отступом 16px от границ ячейки.Примечание. HTML5 больше не поддерживает атрибут для таблиц cellpadding=
.
{|
|-
| style="padding:16px;" |
строка 1, <br>
ячейка/колонка 1
| style="padding:16px;" |
строка 1, <br/>
ячейка/колонка 2
|-
| style="padding:16px;" |
строка 2, <br>
ячейка/колонка 1
| style="padding:16px;" |
строка 2, <br>
ячейка/колонка 2
|}
Рамка приведена только в качестве иллюстрации.
строка 1, ячейка/колонка 1
строка 1, ячейка/колонка 2
строка 2, ячейка/колонка 1
строка 2, ячейка/колонка 2
Таблица с двумя строками и двумя колонками; интервал между ячейками 8px
{| cellspacing="8px"
|-
|
строка 1, <br>
ячейка/колонка 1
|
строка 1, <br>
ячейка/колонка 2
|-
|
строка 2, <br>
ячейка/колонка 1
|
строка 2, <br>
ячейка/колонка 2
|}
Рамка приведена только в качестве иллюстрации.
строка 1, ячейка/колонка 1
строка 1, ячейка/колонка 2
строка 2, ячейка/колонка 1
строка 2, ячейка/колонка 2
Размеры заголовков и ячеек [ ]
Описание
Викитекст
Результат
Таблица с двумя колонками и тремя строками, но верхняя строка выступает в качестве заголовка
{|
|-
! colspan="2" |
Заголовок шириной в две колонки
|-
|
строка 1, <br>
ячейка/колонка 1
|
строка 1, <br>
ячейка/колонка 2
|-
|
строка 2, <br>
ячейка/колонка 1
|
строка 2, <br>
ячейка/колонка 2
|}
Цвета ячеек используются только для иллюстрации.
Заголовок шириной в две колонки
строка 1, ячейка/колонка 1
строка 1, ячейка/колонка 2
строка 2, ячейка/колонка 1
строка 2, ячейка/колонка 2
Таблица с тремя колонками и тремя строками; ячейки во второй строке объединены в одну ячейку
{|
|-
|
строка 1, <br>
ячейка/колонка 1
|
строка 1, <br>
ячейка/колонка 2
|-
| colspan="2" |
строка 2, <br>
ячейка/колонка 1 & 2
|}
Цвета ячеек используются только для иллюстрации.
строка 1, ячейка/колонка 1
строка 1, ячейка/колонка 2
строка 2, ячейка/колонка 1 & 2
Таблица с тремя колонками и тремя строками; ячейки во второй колонке в первой и второй строках объединены в одну ячейку
{|
|-
|
строка 1, <br>
ячейка 1/колонка 1
| rowspan="2" |
строка 1 & 2, <br>
ячейка 2
|-
|
строка2, <br>
ячейка 3/колонка 1
|}
Цвета ячеек используются только для иллюстрации.
строка 1, ячейка 1/колонка 1
строка 1 & 2, ячейка 2
строка 2, ячейка 3/колонка 1
Выравнивание текста в ячейках, заголовках и строках [ ]
Примеры кода для выравнивания текста в ячейках по центру (center), правому краю (right), верху ячейки (top) и низу ячейки (bottom).
Описание
Викитекст
Результат
Таблица с двумя строками и двумя колонками и разным выравниванием текста внутри ячеек
{| width="100%"
|- valign="top"
! align="right" |
строка 1, <br>
заголовок 1, <br>
колонка 1
| align="center" |
строка 1, <br>
ячейка 1/колонка 2
|- valign="bottom"
!
строка 2, <br>
hзаголовок 2, <br>
колонка 1
|
строка 2, <br>
ячейка 2/колонка 2
|}
Цвета ячеек используются только для иллюстрации.
строка 1, заголовок 1, колонка 1
строка 1, ячейка 1/колонка 2
строка 2, заголовок 2, колонка 1
строка 2, ячейка 1/колонка 2
Подписи в таблице [ ]
Описание
Викитекст
Результат
Таблица с двумя строками и двумя колонками и подписью
{| width="100%"
|-
|+ Подпись
!
строка 1, <br>
заголовок 1, <br>
колонка 1
|
строка 1, <br>
ячейка 1/<br>колонка 2
|-
!
строка 2, <br>
заголовок 2, <br>
колонка 1
|
строка 2, <br>
ячейка 2/<br>колонка 2
|}
Подпись
строка 1, заголовок 1, колонка 1
строка 1, ячейка 2/ колонка 2
строка 2, заголовок 2, колонка 1
строка 2, ячейка 2/ колонка 2
Настройка таблицы с помощью CSS [ ]
Описание
Викитекст
Результат
Обычная таблица с 4 ячейками
{| class="article-table"
|-
!
строка 1, <br>
заголовок 1/колонка 1
!
строка 1, <br>
заголовок 2/колонка 2
|-
|
строка 2, <br>
ячейка/колонка 1
|
строка 2, <br>
ячейка/колонка 2
|}
строка 1, заголовок 1/колонка 1
строка 1, заголовок 2/колонка 2
строка 2, ячейка/колонка 1
строка 2, ячейка/колонка 2
Таблица с двумя строками и двумя колонками, окрашенная в жёлтый цвет с помощью CSS
{| style="background-color:yellow;"
|-
|
строка 1, <br>
ячейка/колонка 1
|
строка 1, <br>
ячейка/колонка 2
|-
|
строка 2, <br>
ячейка/колонка 1
|
строка 2, <br>
ячейка/колонка 2
|}
строка 1, ячейка/колонка 1
строка 1, ячейка/колонка 2
строка 2, ячейка/колонка 1
строка 2, ячейка/колонка 2
Таблица с двумя строками и двумя колонками, окрашенная по-разному с помощью CSS
{| style="border:3px inset gray; font-size:80%; width:90%;"
|-
! style="background-color:blue; color:pink; padding-left:1em; width:60%;" |
строка 1, <br>
заголовок 1/колонка 1
| style="text-decoration:line-through;" |
строка 1, <br>
ячейка/колонка 2
|-
! style="text-align:right;" |
строка 2, <br>
заголовок 2/колонка 1
| style="border:1px dotted red;" |
строка 2, <br>
ячейка/колонка 2
|}
строка 1, заголовок 1/колонка 1
строка 1, ячейка/колонка 2
строка 2, заголовок 2/колонка 1
строка 2, ячейка/колонка 2
См. также [ ]