Оформление таблиц — различия между версиями

Материал из КинтВики
Перейти к: навигация, поиск
(Automatic page editing)
м
 
(не показана 1 промежуточная версия 1 участника)
Строка 1: Строка 1:
−
 
−
[[Категория:Public]]
 
 
[[Категория: Оформление материалов]]
 
[[Категория: Оформление материалов]]
  
Строка 445: Строка 443:
 
|}
 
|}
 
|}
 
|}
−
{{Template:Replicate-from-kintwiki}}
 

Текущая версия на 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
Измерение 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
Измерение 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
|}

|}

Выглядит это так:

Регистр 1
Измерение 1 Измерение 2 Ресурс 1
Значение 11 Значение 12 Ресурс 11
Значение 21 Значение 22 Ресурс 21
Регистр 1
Измерение 1 Измерение 2 Ресурс 1
Значение 11 Значение 12 Ресурс 11
Значение 21 Значение 22 Ресурс 21

Объединение ячеек

Источник: http://ru.wikipedia.org/wiki/Википедия:Как_делать_таблицы

В 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



Классы таблиц

Источник: 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
|}
Заголовок 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
|}
Заголовок 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
Заголовок 1 Заголовок 2 Заголовок 3
Ячейка 1*1 Ячейка 2*1 Ячейка 3*1
Ячейка 1*2 Ячейка 2*2 Ячейка 3*2
Ячейка 1*3 Ячейка 2*3 Ячейка 3*3
с классом simple: 
{| class="simple" border=1
Заголовок 1 Заголовок 2 Заголовок 3
Ячейка 1*1 Ячейка 2*1 Ячейка 3*1
Ячейка 1*2 Ячейка 2*2 Ячейка 3*2
Ячейка 1*3 Ячейка 2*3 Ячейка 3*3


Все вышеперечисленные классы также добавляют небольшое пустое расстояние слева и справа к каждой ячейке (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
|}
Заголовок 1 Заголовок 2 Заголовок 3
Ячейка 1*1 Ячейка 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
|}
Заголовок 1 Заголовок 2 Заголовок 3
Ячейка 1*1 Ячейка 2*1 Ячейка 3*1
Ячейка 1*2 Ячейка 2*2 Ячейка 3*2
Ячейка 1*3 Ячейка 2*3 Ячейка 3*3
Источник — «http://wiki.kint.ru/index.php?title=Оформление_таблиц&oldid=22644»