Оформление таблиц — различия между версиями
Rebot (обсуждение | вклад) (Automatic page editing) |
м |
||
| (не показаны 2 промежуточные версии 1 участника) | |||
| Строка 1: | Строка 1: | ||
| − | |||
| − | |||
[[Категория: Оформление материалов]] | [[Категория: Оформление материалов]] | ||
| Строка 396: | Строка 394: | ||
!Заголовок 1||Заголовок 2||Заголовок 3 | !Заголовок 1||Заголовок 2||Заголовок 3 | ||
|- | |- | ||
| − | |Ячейка 1*1||Ячейка 2*1 | + | |Ячейка 1*1 |
| + | |align=right|Ячейка 2*1 | ||
| + | |Ячейка 3*1 | ||
|- | |- | ||
|Ячейка 1*2||Ячейка 2*2||Ячейка 3*2 | |Ячейка 1*2||Ячейка 2*2||Ячейка 3*2 | ||
| Строка 408: | Строка 408: | ||
!Заголовок 1||Заголовок 2||Заголовок 3 | !Заголовок 1||Заголовок 2||Заголовок 3 | ||
|- | |- | ||
| − | |Ячейка 1*1||Ячейка 2*1 | + | |Ячейка 1*1 |
| + | |align=right|Ячейка 2*1 | ||
| + | |Ячейка 3*1 | ||
|- | |- | ||
|Ячейка 1*2||Ячейка 2*2||Ячейка 3*2 | |Ячейка 1*2||Ячейка 2*2||Ячейка 3*2 | ||
| Строка 441: | Строка 443: | ||
|} | |} | ||
|} | |} | ||
| − | |||
Текущая версия на 00:48, 8 февраля 2011
Предлагаются следующие шаблоны оформления:
Содержание
Оформление с выделением цветом
{| border="1" cellpadding="4" cellspacing="1" style="background:#F0F0F0;"
|+'''Заголовок таблицы'''
!style="background:#80FFFF;" width=30%|Заголовок колонки 1
!style="background:#CCFFCC;" width=20%|Заголовок колонки 2
!style="background:#CCFFCC;" width=20%|Заголовок колонки 3
!style="background:#FFFFCC;" width=20%|Заголовок колонки 4
|-align="center"
| Строка 1
| 12
| 13
| 14
|-align="center"
| Строка 2
| 22
| 23
| 24
|-align="center" style="background:#CCFFCC;"
| colspan=3 align="left" | Итог по таблице
| style="background:#FF8080;"| 38
|}
Выглядит это так:
| Заголовок колонки 1 | Заголовок колонки 2 | Заголовок колонки 3 | Заголовок колонки 4 |
|---|---|---|---|
| Строка 1 | 12 | 13 | 14 |
| Строка 2 | 22 | 23 | 24 |
| Итог по таблице | 38 | ||
Оформление с выделением дополнительными линиями контура таблицы
{| border="1" cellpadding="2" cellspacing="1"
|+'''Регистр 1'''
! width="150" style="background:#C0C0C0; border-bottom:2px solid black;"| Измерение 1
! width="150" style="background:#C0C0C0; border-bottom:2px solid black;"| Измерение 2
! width="150" style="background:#C0C0C0;"| Ресурс 1
|- align="center"
| Значение 11 || Значение 12 || Ресурс 11
|- align="center"
| Значение 21 || Значение 22 || Ресурс 21
|}
Выглядит это так:
| Измерение 1 | Измерение 2 | Ресурс 1 |
|---|---|---|
| Значение 11 | Значение 12 | Ресурс 11 |
| Значение 21 | Значение 22 | Ресурс 21 |
Простая таблица
{| border="1" cellpadding="2" cellspacing="1"
|+'''Регистр 1'''
! style="background:#C0C0C0;"| Измерение 1
! style="background:#C0C0C0;"| Измерение 2
! style="background:#C0C0C0;"| Ресурс 1
|- align="center"
| Значение 11 || Значение 12 || Ресурс 11
|- align="center"
| Значение 21 || Значение 22 || Ресурс 21
|}
Выглядит это так:
| Измерение 1 | Измерение 2 | Ресурс 1 |
|---|---|---|
| Значение 11 | Значение 12 | Ресурс 11 |
| Значение 21 | Значение 22 | Ресурс 21 |
Расположение двух таблиц по горизонтали
Для такого расположения можно использовать, как делается и в html, вложенные таблицы. При этом для внешней таблицы устанавливается свойство border=0
Например:
{| border=0
|
{| border="1" cellpadding="2" cellspacing="1"
|+'''Регистр 1'''
! width="150" style="background:#C0C0C0; border-bottom:2px solid black;"| Измерение 1
! width="150" style="background:#C0C0C0; border-bottom:2px solid black;"| Измерение 2
! width="150" style="background:#C0C0C0;"| Ресурс 1
|- align="center"
| Значение 11 || Значение 12 || Ресурс 11
|- align="center"
| Значение 21 || Значение 22 || Ресурс 21
|}
|| || || ||
{| border="1" cellpadding="2" cellspacing="1"
|+'''Регистр 1'''
! width="150" style="background:#C0C0C0; border-bottom:2px solid black;"| Измерение 1
! width="150" style="background:#C0C0C0; border-bottom:2px solid black;"| Измерение 2
! width="150" style="background:#C0C0C0;"| Ресурс 1
|- align="center"
| Значение 11 || Значение 12 || Ресурс 11
|- align="center"
| Значение 21 || Значение 22 || Ресурс 21
|}
|}
Выглядит это так:
|
|
Объединение ячеек
Источник: http://ru.wikipedia.org/wiki/Википедия:Как_делать_таблицы
В wiki-стиле, как и в HTML, имеется возможность объединять несколько ячеек как по вертикали, так и по горизонтали. Для объединения по вертикали применяется атрибут rowspan=n, где «n» — число ячеек, которые должна объединить данная ячейка. Этот атрибут вписывается перед содержанием объединяющей ячейки.
Пример:
| Вертикальное объединение двух ячеек пишется так: | Выглядеть это будет так: | |||||||||
{| border=1
|Ячейка 1
|rowspan=2 |Ячейка 2, объединяет два ряда таблицы
|Ячейка 3
|-
|Ячейка 4
|Ячейка 5
|}
|
|
Для объединения по горизонтали используется атрибут colspan=n.
Пример:
{| border=1
|Ячейка 1
|colspan=2 |Ячейка 2, объединяет два столбца
|-
|Ячейка 3
|Ячейка 4
|Ячейка 5
|}
Выглядит это так:
| Ячейка 1 | Ячейка 2, объединяет два столбца | |
| Ячейка 3 | Ячейка 4 | Ячейка 5 |
Классы таблиц
Источник: http://ru.wikipedia.org/wiki/Википедия:Оформление_таблиц
При создании таблиц желательно придерживаться стандартного стиля оформления. В Википедии это реализовано с помощью CSS классов, добавленных в файл Mediawiki:Common.css.
Укажите в первой строке параметр class="имя_класса", и таблица будет оформлена стандартным образом.
standard
Это наиболее часто встречающиеся таблицы. Такой стиль оформления желательно использовать для большинства таблиц, расположенных непосредственно в тексте статьи. Обратите внимание, что заголовки таблицы (которые создаются с помощью символа "!") подсвечены, для этого не нужно указывать никаких дополнительных параметров. Параметр border тоже необязателен.
{| class="standard"
|-
!Заголовок 1||Заголовок 2||Заголовок 3
|-
!Ячейка 1*1
|Ячейка 2*1||Ячейка 3*1
|-
!Ячейка 1*2
|Ячейка 2*2||Ячейка 3*2
|-
!Ячейка 1*3
|Ячейка 2*3||Ячейка 3*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
|}
| Заголовок 1 | Заголовок 2 | Заголовок 3 |
|---|---|---|
| Ячейка 1*1 | Ячейка 2*1 | Ячейка 3*1 |
| Ячейка 1*2 | Ячейка 2*2 | Ячейка 3*2 |
| Ячейка 1*3 | Ячейка 2*3 | Ячейка 3*3 |
tiles
Отличается от standard отсутствием линий сетки и затенением обычных ячеек. Не используйте его для таблиц, к которым можно применить какой-нибудь из двух предыдущих стилей без потери наглядности. Примером оправданного применения может быть, например, таблица Менделеева.
{| class="tiles"
|-
!Заголовок 1||Заголовок 2||Заголовок 3
|-
|Ячейка 1*1||Ячейка 2*1||Ячейка 3*1
|-
|Ячейка 1*2||Ячейка 2*2||Ячейка 3*2
|-
|Ячейка 1*3||Ячейка 2*3||Ячейка 3*3
|}
|
|
simple
Этот класс меняет только сетку границ между ячейками, делая её такой же как в standard, он имеет смысл только с ненулевым border. Сравните:
просто border
{| border=1
|
с классом simple:
{| class="simple" border=1
|
Все вышеперечисленные классы также добавляют небольшое пустое расстояние слева и справа к каждой ячейке (padding-left:0.2em; padding-right:0.2em).
wikitable/prettytable
Также поддерживаются классы wikitable/prettytable из английской Википедии. У этих классов пустое расстояние добавляется в каждую ячейку со всех сторон (padding:0.2em). В остальном wikitable практически идентичен standard, а prettytable отличается цветом заголовка таблицы.
{| class="wikitable"
|-
!Заголовок 1||Заголовок 2||Заголовок 3
|-
|Ячейка 1*1
|align=right|Ячейка 2*1
|Ячейка 3*1
|-
|Ячейка 1*2||Ячейка 2*2||Ячейка 3*2
|-
|Ячейка 1*3||Ячейка 2*3||Ячейка 3*3
|}
|
|
{| class="prettytable"
|-
!Заголовок 1||Заголовок 2||Заголовок 3
|-
|Ячейка 1*1||Ячейка 2*1||Ячейка 3*1
|-
|Ячейка 1*2||Ячейка 2*2||Ячейка 3*2
|-
|Ячейка 1*3||Ячейка 2*3||Ячейка 3*3
|}
|
|
