Персональные инструменты
CUSTIS
Сайт CUSTIS →
Вакансии
Блог команды
Архив событий
Архив публикаций
Навигация
Заглавная страница
Свежие правки
Случайная статья
Справка
Поиск
 
Инструменты
Ссылки сюда
Связанные правки
Спецстраницы
Версия для печати
Чистый HTML
→M$WORD
→OOffice

Справка:Таблицы — различия между версиями

Материал из CustisWiki

Перейти к: навигация, поиск
м (1 версия)
 
(не показано 11 промежуточных версий 4 участников)
Строка 1: Строка 1:
−
[[Category:{{SITENAME}}:Справка]]
 
−
 
 
Таблицы являются удобной формой для отображения информации. Но таблицы выполняют лишь тогда свою цель, когда между строчками и столбцами имеется смысловая связь, т. е. информацию в них можно рассортировать неким образом, например, по дате или алфавиту.
 
Таблицы являются удобной формой для отображения информации. Но таблицы выполняют лишь тогда свою цель, когда между строчками и столбцами имеется смысловая связь, т. е. информацию в них можно рассортировать неким образом, например, по дате или алфавиту.
  
 
С другой стороны, таблицы сложнее обычного текста. Так что применять их имеет смысл лишь там, где они действительно улучшают восприятие материала. Поэтому предварительно обдумывайте: не лучше ли использовать обычный список.
 
С другой стороны, таблицы сложнее обычного текста. Так что применять их имеет смысл лишь там, где они действительно улучшают восприятие материала. Поэтому предварительно обдумывайте: не лучше ли использовать обычный список.
  
−
=== Таблицы в машинописном стиле без форматирования ===
+
== Расширение SimpleTable ==
−
Простейший и быстрейший способ создать таблицу — это написать ее в машинописном стиле, с помощью преформатированных блоков.
+
−
Столбцы и общий вид форматируются визуально. Например:
+
  
−
<center>Климатическая таблица</center>
+
Простейший способ с минимумом «шумовых» символов и с соблюдением модели «строка таблицы=строка текста» — это использование расширения SimpleTable и тега «tab».
−
Месяцы:            январь февраль март апрель май июнь июль август сентябрь октябрь ноябрь декабрь
+
−
----------------------------------------------------------------------------------------------------------------------------------------------------------------------------------
+
−
Дневная температура  21    21      22    23  25  27    29    28    26      24      22    20
+
−
Ночная температура  15    15      15    16  17  17    18    17    16      15      15    14
+
−
Солнечные часы/день  6      6      7    8  9    9    9    8      7      7      6      6
+
−
Дождливые дни/месяц  6      4      3    2  2    1    0    0      2      5      6      7
+
−
Температура воды    19    18      18    18  19  20    21    23    20      18      18    18
+
  
−
===Расширение SimpleTable===
+
{{NoteBox|1=Этот же способ удобно применять для копипасты простых таблиц из Excel’я и подобных программ — нужно только написать <tt>&lt;tab sep=tab&gt;</tt>. Если, однако, таблица содержит объединённые ячейки или специфичные стили ячеек, то способ не подходит, и нужно смотреть в сторону [[#Импорт таблиц из внешних приложений в вики-синтаксис]].}}
−
Еще один простейший способ с минимумом «шумовых» символов и с соблюдением модели
+
−
«строка таблицы=строка текста», это использовать расширение SimpleTable и тег «tab».
+
  
 
Например,
 
Например,
−
<nowiki>
+
<pre>
−
<tab cellpadding="5" border=1 sep=spaces head=top>
+
<tab class=wikitable sep=spaces head=top>
 
Месяцы:            январь февраль март апрель май июнь июль август сентябрь октябрь ноябрь декабрь
 
Месяцы:            январь февраль март апрель май июнь июль август сентябрь октябрь ноябрь декабрь
 
Дневная_температура  21    21      22    23  25  27    29    28    26      24      22    20
 
Дневная_температура  21    21      22    23  25  27    29    28    26      24      22    20
Строка 32: Строка 19:
 
Температура_воды    19    18      18    18  19  20    21    23    20      18      18    18
 
Температура_воды    19    18      18    18  19  20    21    23    20      18      18    18
 
</tab>
 
</tab>
−
  </nowiki>
+
</pre>
  
−
<tab cellpadding="5" border=1 sep=spaces  head=top>
+
<tab class=wikitable sep=spaces  head=top>
 
Месяцы:            январь февраль март апрель май июнь июль август сентябрь октябрь ноябрь декабрь
 
Месяцы:            январь февраль март апрель май июнь июль август сентябрь октябрь ноябрь декабрь
 
Дневная_температура  21    21      22    23  25  27    29    28    26      24      22    20
 
Дневная_температура  21    21      22    23  25  27    29    28    26      24      22    20
Строка 43: Строка 30:
 
</tab>
 
</tab>
  
−
Атрибуты тега «tab»:
+
Атрибуты тега «tab», обрабатываемые самим SimpleTable:
 
;sep: Символ-сепаратор колонок:
 
;sep: Символ-сепаратор колонок:
 
:;tab: символ табуляции
 
:;tab: символ табуляции
Строка 50: Строка 37:
 
:;comma: запятая
 
:;comma: запятая
 
:;bar: вертикальная черта «|»
 
:;bar: вертикальная черта «|»
 +
:;Другие: Есть возможность определить как разделитель любую последовательность символов. Скажем, <tt>sep="%%"</tt> разобьёт строчку по двойному символу процента.
 
;head: этот атрибут, если есть, указывает, где распологается заголовок таблицы.
 
;head: этот атрибут, если есть, указывает, где распологается заголовок таблицы.
 
:;top: верхняя запись
 
:;top: верхняя запись
Строка 55: Строка 43:
 
:;topleft: и верхняя запись и первая (левая) колонка таблицы.
 
:;topleft: и верхняя запись и первая (левая) колонка таблицы.
  
−
Также понимает следующие атрибуты, как HTML-атрибуты таблиц:
+
Также принимаются все атрибуты, которые можно указать в стандартном синтаксисе вики-таблиц, например:
−
;border: толщина границ
+
;class: Название CSS-стиля таблицы. Стиль применяется к самой таблице, а не к её ячейкам.
−
;cellpadding: поля между значениями ячеек и границами ячеек.
+
;:Чтобы не видеть убогие стандартные HTML-рамочки, рекомендуется всегда использовать <tt>class="wikitable"</tt>.
 +
;:Чтобы применить стиль к ячейкам, нужно определить класс <tt>.className td</tt>. Например, чтобы выровнять все ячейки по левому краю, нужно добавить на страницу следующий текст: <pre><html><style>.classname td { text-align: right; }</style></html></pre>
 +
;border: Толщина границ, попадает в HTML-атрибут таблицы. Подобные границы выглядят убого, лучше используйте класс simpletable.
 +
;cellpadding: Ширина поля между значениями ячеек и границами ячеек.
  
−
И наконец, используя <tt>class="sortable"</tt>, можно делать динамически сортируемые таблицы:
+
И наконец, добавляя к <tt>class</tt> слово <tt>sortable</tt>, можно делать динамически сортируемые таблицы:
  
−
<tab cellpadding="5" border=1 class="sortable" sep=spaces  head=top>
+
<tab class="wikitable sortable" sep=spaces  head=top>
 
EMP_NO    DEPT_NO    PRO_NO    EMP_BDATE    EMP_SAL    EMP_BONUS
 
EMP_NO    DEPT_NO    PRO_NO    EMP_BDATE    EMP_SAL    EMP_BONUS
 
2441    1    155    1955    16000.00    14000.00
 
2441    1    155    1955    16000.00    14000.00
−
2442    1    208    1960    14000.00    NULL
+
2442    1    20    1960    14000.00    NULL
 
2443    1    NULL    1960    16000.00    13000.00
 
2443    1    NULL    1960    16000.00    13000.00
 
2452    1    155    NULL    15000.00    14000.00
 
2452    1    155    NULL    15000.00    14000.00
Строка 71: Строка 62:
 
</tab>
 
</tab>
  
−
=== Простейшая таблица ===
+
== Таблицы в стандартном синтаксисе MediaWiki ==
 +
 
 
Любая таблица в wiki-стиле начинается с фигурной скобки '''{''' с последующей вертикальной чертой '''<nowiki>|</nowiki>''' и заканчивается вертикальной чертой '''<nowiki>|</nowiki>''' с закрывающей фигурной скобкой '''}'''. Каждая ячейка строки начинается вертикальной черточки '''<nowiki>|</nowiki>''', после которой пишется ее содержание.
 
Любая таблица в wiki-стиле начинается с фигурной скобки '''{''' с последующей вертикальной чертой '''<nowiki>|</nowiki>''' и заканчивается вертикальной чертой '''<nowiki>|</nowiki>''' с закрывающей фигурной скобкой '''}'''. Каждая ячейка строки начинается вертикальной черточки '''<nowiki>|</nowiki>''', после которой пишется ее содержание.
 
   
 
   
−
'''Пример:'''
+
'''Пример:'''
−
Таблица с одной строкой пишется так:
+
Таблица с одной строкой пишется так:
 +
 
 
  <nowiki>{|
 
  <nowiki>{|
 
  |Ячейка 1
 
  |Ячейка 1
Строка 81: Строка 74:
 
  |Ячейка 3
 
  |Ячейка 3
 
  |}</nowiki>
 
  |}</nowiki>
 +
 
В [[{{SITENAME}}]] это будет выглядеть так:
 
В [[{{SITENAME}}]] это будет выглядеть так:
 +
 
  {|
 
  {|
 
  |Ячейка 1
 
  |Ячейка 1
Строка 90: Строка 85:
 
Для введения следующей строки после вертикальной черточки ставится штрих «-». Таким образом можно вводить любое количество строк.
 
Для введения следующей строки после вертикальной черточки ставится штрих «-». Таким образом можно вводить любое количество строк.
 
   
 
   
−
'''Пример:'''
+
'''Пример:'''
−
Таблица в две строки пишется так:
+
Таблица в две строки пишется так:
 +
 
 
  <nowiki>{|
 
  <nowiki>{|
 
  |Ячейка 1*1
 
  |Ячейка 1*1
Строка 103: Строка 99:
  
 
В [[{{SITENAME}}]] это будет выглядеть так:
 
В [[{{SITENAME}}]] это будет выглядеть так:
 +
 
{|
 
{|
 
  |Ячейка 1*1
 
  |Ячейка 1*1
Строка 113: Строка 110:
 
  |}
 
  |}
  
−
Таблица в три строки пишется так:
+
Таблица в три строки пишется так:
 +
 
 
  <nowiki>{|
 
  <nowiki>{|
 
  |Ячейка 1*1
 
  |Ячейка 1*1
Строка 129: Строка 127:
  
 
А в [[{{SITENAME}}]] это будет выглядеть так:
 
А в [[{{SITENAME}}]] это будет выглядеть так:
 +
 
{|
 
{|
 
  |Ячейка 1*1
 
  |Ячейка 1*1
Строка 146: Строка 145:
  
 
=== Табличные рамки ===
 
=== Табличные рамки ===
−
Вид рамки описывается в первой строке, сразу после '''{|'''. Не забудьте, что между ними и атрибутом должен быть пробел. В настоящее время возможно устанавливать лишь толщину рамки атрибутом '''border=n''', где «n» — толщина линии рамки.
+
 
−
'''Пример:'''
+
Вид рамки, как и другие параметры таблицы, можно указать сразу после '''{|'''. Не забудьте, что между ними и атрибутом должен быть пробел.
−
Для последней таблицы рамку можно создать так:
+
 
−
<nowiki>{| border=1
+
Однако, вместо <tt>border=1</tt> рекомендуется опять-таки просто использовать <tt>class=wikitable</tt> — выглядит куда симпатичнее.
 +
 
 +
'''Пример:'''
 +
Для последней таблицы рамку можно создать так:
 +
 
 +
{| cellpadding=4
 +
!
 +
! border=1
 +
! class=wikitable
 +
|-
 +
! Код
 +
|
 +
<pre>
 +
{| border=1
 
  |Ячейка 1*1
 
  |Ячейка 1*1
 
  |Ячейка 2*1
 
  |Ячейка 2*1
Строка 161: Строка 173:
 
  |Ячейка 2*3
 
  |Ячейка 2*3
 
  |Ячейка 3*3
 
  |Ячейка 3*3
−
  |}</nowiki>
+
  |}
−
 
+
</pre>
−
В [[{{SITENAME}}]] это будет выглядеть следующим образом:
+
|
−
{| border=1
+
<pre>
 +
{| class=wikitable
 
  |Ячейка 1*1
 
  |Ячейка 1*1
 
  |Ячейка 2*1
 
  |Ячейка 2*1
Строка 177: Строка 190:
 
  |Ячейка 3*3
 
  |Ячейка 3*3
 
  |}
 
  |}
 +
</pre>
 +
|-
 +
! Результат
 +
|
 +
{| border=1
 +
|Ячейка 1*1
 +
|Ячейка 2*1
 +
|Ячейка 3*1
 +
|-
 +
|Ячейка 1*2
 +
|Ячейка 2*2
 +
|Ячейка 3*2
 +
|-
 +
|Ячейка 1*3
 +
|Ячейка 2*3
 +
|Ячейка 3*3
 +
|}
 +
|
 +
{| class=wikitable
 +
|Ячейка 1*1
 +
|Ячейка 2*1
 +
|Ячейка 3*1
 +
|-
 +
|Ячейка 1*2
 +
|Ячейка 2*2
 +
|Ячейка 3*2
 +
|-
 +
|Ячейка 1*3
 +
|Ячейка 2*3
 +
|Ячейка 3*3
 +
|}
 +
|}
  
 
=== Заголовки ===
 
=== Заголовки ===
 +
 
Чтобы содержание ячейки выделялись жирным шрифтом и отцентрированны, вместо вертикальных чёрточек ставятся восклицательные знаки. Это можно применять для выделения заголовков.
 
Чтобы содержание ячейки выделялись жирным шрифтом и отцентрированны, вместо вертикальных чёрточек ставятся восклицательные знаки. Это можно применять для выделения заголовков.
 
   
 
   
 
'''Пример:'''  
 
'''Пример:'''  
 +
 
Для последней таблицы можно написать так:
 
Для последней таблицы можно написать так:
−
  <nowiki>{| border=1
+
 
 +
  <nowiki>{| class=wikitable
 
  !Первый столбец
 
  !Первый столбец
 
  !Второй столбец
 
  !Второй столбец
Строка 202: Строка 250:
  
 
В [[{{SITENAME}}]] это будет выглядеть следующим образом:
 
В [[{{SITENAME}}]] это будет выглядеть следующим образом:
−
{| border=1
+
 
 +
{| class=wikitable
 
  !Первый столбец
 
  !Первый столбец
 
  !Второй столбец
 
  !Второй столбец
Строка 221: Строка 270:
  
 
=== Запись в одну строчку ===
 
=== Запись в одну строчку ===
 +
 
Чтобы сделать записываемую в таблицу информацию более читабельной, можно писать ряды в одну строчку (если записи в них не очень длинные), отделяя их вертикальной чертой.
 
Чтобы сделать записываемую в таблицу информацию более читабельной, можно писать ряды в одну строчку (если записи в них не очень длинные), отделяя их вертикальной чертой.
  
 
'''Пример:'''
 
'''Пример:'''
 
Для последней таблицы можно написать так:
 
Для последней таблицы можно написать так:
−
  <nowiki>{| border=1
+
  <nowiki>{| class=wikitable
 
  !Первый столбец||Второй столбец||Третий столбец
 
  !Первый столбец||Второй столбец||Третий столбец
 
  |-
 
  |-
Строка 236: Строка 286:
  
 
В [[{{SITENAME}}]] это будет выглядеть следующим образом:
 
В [[{{SITENAME}}]] это будет выглядеть следующим образом:
−
{| border=1
+
{| class=wikitable
 
  !Первый столбец||Второй столбец||Третий столбец
 
  !Первый столбец||Второй столбец||Третий столбец
 
  |-
 
  |-
Строка 246: Строка 296:
 
  |}
 
  |}
  
−
=== Rowspanning и Colspanning ===
+
=== Объединённые ячейки ===
 +
 
 
В wiki-стиле, как и в HTML, имеется возможность «растягивать» ячейки как по вертикали, так и по горизонтали.
 
В wiki-стиле, как и в HTML, имеется возможность «растягивать» ячейки как по вертикали, так и по горизонтали.
−
Для «растягивания» по вертикали применяется атрибут ''rowspan=n'', где «n» — число ячеек, на которые должна «тянуться» данная ячейка. Этот атрибут вписывается перед содержанием «растягиваемой» ячейки.
+
 
 +
Для слияния ячеек по вертикали применяется атрибут ''rowspan=n'', где «n» — число ячеек, на которые должна «тянуться» данная ячейка. Этот атрибут вписывается перед содержанием «растягиваемой» ячейки.
  
 
'''Пример:'''
 
'''Пример:'''
−
Вертикальное «растягивание» на две ячейки пишется так:
+
Вертикальное слияние двух ячеек пишется так:
−
  <nowiki>{| border=1
+
 
 +
  <nowiki>{| class=wikitable
 
  |Ячейка 1
 
  |Ячейка 1
 
  |rowspan=2 |Ячейка 2, растянута
 
  |rowspan=2 |Ячейка 2, растянута
Строка 260: Строка 313:
 
  |Ячейка 5
 
  |Ячейка 5
 
  |}</nowiki>
 
  |}</nowiki>
 +
 
Выглядеть это будет так:
 
Выглядеть это будет так:
−
  {| border=1
+
 
 +
  {| class=wikitable
 
  |Ячейка 1
 
  |Ячейка 1
 
  |rowspan=2 |Ячейка 2, растянута
 
  |rowspan=2 |Ячейка 2, растянута
Строка 270: Строка 325:
 
  |}
 
  |}
  
−
Для «растягивания» по горизонтали используется атрибут ''colspan=n''.
+
Для горизонтального слияния используется атрибут ''colspan=n''.
 +
 
 
'''Пример:'''
 
'''Пример:'''
−
  <nowiki>{| border=1
+
  <nowiki>{| class=wikitable
 
  |Ячейка 1
 
  |Ячейка 1
 
  |colspan=2 |Ячейка 2, растянута
 
  |colspan=2 |Ячейка 2, растянута
Строка 282: Строка 338:
  
 
Выглядит это так:
 
Выглядит это так:
−
{| border=1
+
 
 +
{| class=wikitable
 
  |Ячейка 1
 
  |Ячейка 1
 
  |colspan=2 |Ячейка 2, растянута
 
  |colspan=2 |Ячейка 2, растянута
Строка 292: Строка 349:
  
 
=== «Раскраска» таблиц ===
 
=== «Раскраска» таблиц ===
 +
 
'''Текст''', находящийся в таблице, можно сделать цветным. С этой целью применяются те же тэги, что и в HTML:
 
'''Текст''', находящийся в таблице, можно сделать цветным. С этой целью применяются те же тэги, что и в HTML:
 
* для отдельного слова — <nowiki><font color="#ABCDEF">Teкст</font></nowiki>;
 
* для отдельного слова — <nowiki><font color="#ABCDEF">Teкст</font></nowiki>;
 
* для длинного текста — <nowiki><div style="color:#ABCDEF">Текст, текст.</div></nowiki>,
 
* для длинного текста — <nowiki><div style="color:#ABCDEF">Текст, текст.</div></nowiki>,
−
где «ABCDEF» — индекс цвета в [[RuPedia:Википедия:Таблица цветов|Таблице цветов]].
+
где «ABCDEF» — индекс цвета в [[WikiHelp:Таблица цветов (фон)|Таблице цветов]].
 +
 
 
  '''Пример:'''
 
  '''Пример:'''
 
  Для "раскраски" текста пишут так:
 
  Для "раскраски" текста пишут так:
−
  <nowiki>{| border=1
+
  <nowiki>{| class=wikitable
 
  |Ячейка 1*1
 
  |Ячейка 1*1
 
  |Здесь цветное только <font color="#FF00FF">одно</font> слово.
 
  |Здесь цветное только <font color="#FF00FF">одно</font> слово.
Строка 311: Строка 370:
 
  |Ячейка 3*3
 
  |Ячейка 3*3
 
  |}</nowiki>
 
  |}</nowiki>
 +
 
В [[{{SITENAME}}]] это будет выглядеть следующим образом:
 
В [[{{SITENAME}}]] это будет выглядеть следующим образом:
−
  {| border=1
+
 
 +
  {| class=wikitable
 
  |Ячейка 1*1
 
  |Ячейка 1*1
 
  |Здесь цветное только <font color="#FF00FF">одно</font> слово.
 
  |Здесь цветное только <font color="#FF00FF">одно</font> слово.
Строка 326: Строка 387:
 
  |}
 
  |}
  
−
Сделать '''цветную ячейку''' можно с помощью атрибута «bgcolor=#ABCDEF», где «ABCDEF» обозначает, как вы уже, наверное, догадались, индекс цвета в [[RuPedia:Википедия:Таблица цветов|Таблице цветов]].
+
Сделать '''цветную ячейку''' можно с помощью атрибута «bgcolor=#ABCDEF», где «ABCDEF» обозначает, как вы уже, наверное, догадались, индекс цвета в [[WikiHelp:Таблица цветов (фон)|Таблице цветов]].
 +
 
 
  '''Пример:'''
 
  '''Пример:'''
 
  Для "раскраски" одной ячейки пишется так:
 
  Для "раскраски" одной ячейки пишется так:
−
  <nowiki>{| border=1
+
  <nowiki>{| class=wikitable
 
  |Ячейка 1*1
 
  |Ячейка 1*1
 
  |bgcolor=#FFCC00|Ячейка 2*1
 
  |bgcolor=#FFCC00|Ячейка 2*1
Строка 343: Строка 405:
 
  |}</nowiki>
 
  |}</nowiki>
 
В [[{{SITENAME}}]] это будет выглядеть следующим образом:
 
В [[{{SITENAME}}]] это будет выглядеть следующим образом:
−
  {| border=1
+
  {| class=wikitable
 
  |Ячейка 1*1
 
  |Ячейка 1*1
 
  |bgcolor=#FFCC00|Ячейка 2*1
 
  |bgcolor=#FFCC00|Ячейка 2*1
Строка 358: Строка 420:
  
 
=== Вложенные таблицы ===
 
=== Вложенные таблицы ===
 +
 
Для создания таблицы внутри уже имеющейся, надо вписать в нужном месте фигурную скобку с вертикальной черточкой, как при написании обычной таблицы. Обратите внимание, что горизонтальной черточки в начале строки '''не должно''' быть. Не забудьте также закрыть внутреннюю таблицу.
 
Для создания таблицы внутри уже имеющейся, надо вписать в нужном месте фигурную скобку с вертикальной черточкой, как при написании обычной таблицы. Обратите внимание, что горизонтальной черточки в начале строки '''не должно''' быть. Не забудьте также закрыть внутреннюю таблицу.
 +
 
  '''Пример:'''
 
  '''Пример:'''
 
  <nowiki>{| border=1
 
  <nowiki>{| border=1
Строка 383: Строка 447:
  
 
=== Название таблицы ===
 
=== Название таблицы ===
 +
 
Чтобы название таблицы было отцентрировано по ее ширине, нужно после вертикальной чёрточки поставить знак «+». Само название можно форматировать обычными wiki-атрибутами.
 
Чтобы название таблицы было отцентрировано по ее ширине, нужно после вертикальной чёрточки поставить знак «+». Само название можно форматировать обычными wiki-атрибутами.
 
  '''Пример:'''
 
  '''Пример:'''
Строка 441: Строка 506:
 
  |}
 
  |}
  
−
=== Импорт таблиц из внешних приложений ===
+
=== Импорт таблиц из внешних приложений в вики-синтаксис ===
−
Иногда возникает задача импорта
+
−
сложных таблиц из Office-приложений
+
−
(MS Word, MS Excel, Open Office).
+
  
−
В таком случае, надо:
+
Иногда возникает задача импорта сложных таблиц из Office-приложений (MS Word, MS Excel, Open Office).
 +
 
 +
«Сложные» таблицы — это таблицы, имеющие различные стили ячеек и/или объединённые ячейки.
 +
 
 +
==== С помощью wikEd — просто, но некрасиво ====
 +
 
 +
# Используем Firefox, Chrome или Safari.
 +
# Включаем wikEd, если оный выключен (кнопочка с карандашом в правом верхнем углу страницы).
 +
# Делаем Copy-Paste таблицы в статью.
 +
# Нажимаем кнопку [W] — Wikify, выглядит она так: [[File:WikEd_wikify.png]].
 +
 
 +
==== Ручками — сложнее, но красивее ====
 +
 
 +
Нужно:
 
* добиться сохранения таблицы в [[HTML]]-формате (например, скопировать таблицу из MS Excel в MS Word, сохранить в формате «web-page filtered»).
 
* добиться сохранения таблицы в [[HTML]]-формате (например, скопировать таблицу из MS Excel в MS Word, сохранить в формате «web-page filtered»).
 
* «Почистить» таблицу от лишних тэгов и атрибутов с помощью программы [[Tidy]]. Примерный вызов [[Tidy]] для HTML таблицы из сохраненной из «MS Word» следующий:
 
* «Почистить» таблицу от лишних тэгов и атрибутов с помощью программы [[Tidy]]. Примерный вызов [[Tidy]] для HTML таблицы из сохраненной из «MS Word» следующий:
Строка 452: Строка 527:
 
* Вставить полученную (очищенную и отформатированную) [[HTML]]-таблицу в статью.
 
* Вставить полученную (очищенную и отформатированную) [[HTML]]-таблицу в статью.
  
 +
== Таблицы в машинописном стиле без форматирования ==
 +
 +
Последний способ создать таблицу — это написать ее в машинописном стиле, с помощью преформатированных блоков. Столбцы и общий вид форматируются визуально. Например:
 +
 +
                                        Климатическая таблица
 +
 +
Месяцы:            январь февраль март апрель май июнь июль август сентябрь октябрь ноябрь декабрь
 +
--------------------------------------------------------------------------------------------------
 +
Дневная температура  21    21      22    23  25  27    29    28    26      24      22    20
 +
Ночная температура  15    15      15    16  17  17    18    17    16      15      15    14
 +
Солнечные часы/день  6      6      7    8  9    9    9    8      7      7      6      6
 +
Дождливые дни/месяц  6      4      3    2  2    1    0    0      2      5      6      7
 +
Температура воды    19    18      18    18  19  20    21    23    20      18      18    18
 +
 +
[[Category:Справка]]
 
{{replicate-from-custiswiki-to-lib}}
 
{{replicate-from-custiswiki-to-lib}}
−
{{replicate-from-custiswiki-to-all}}
+
{{replicate-from-custiswiki-to-smwiki}}
 +
{{replicate-from-custiswiki-to-4intranet}}

Текущая версия на 17:47, 20 сентября 2013

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

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

Расширение SimpleTable

Простейший способ с минимумом «шумовых» символов и с соблюдением модели «строка таблицы=строка текста» — это использование расширения SimpleTable и тега «tab».

Note.svg Этот же способ удобно применять для копипасты простых таблиц из Excel’я и подобных программ — нужно только написать <tab sep=tab>. Если, однако, таблица содержит объединённые ячейки или специфичные стили ячеек, то способ не подходит, и нужно смотреть в сторону #Импорт таблиц из внешних приложений в вики-синтаксис.

Например, 

<tab class=wikitable sep=spaces head=top>
Месяцы:            январь февраль март апрель май июнь июль август сентябрь октябрь ноябрь декабрь
Дневная_температура  21     21      22    23  25   27    29    28     26      24      22     20
Ночная_температура   15     15      15    16  17   17    18    17     16      15      15     14
Солнечные_часы/день   6      6       7     8   9    9     9     8      7       7       6      6
Дождливые_дни/месяц   6      4       3     2   2    1     0     0      2       5       6      7
Температура_воды     19     18      18    18  19   20    21     23    20      18      18     18
</tab>
Месяцы:январьфевральмартапрельмайиюньиюльавгустсентябрьоктябрьноябрьдекабрь
Дневная_температура212122232527292826242220
Ночная_температура151515161717181716151514
Солнечные_часы/день667899987766
Дождливые_дни/месяц643221002567
Температура_воды191818181920212320181818

Атрибуты тега «tab», обрабатываемые самим SimpleTable:

sep
Символ-сепаратор колонок:
tab
символ табуляции
space
пробел
spaces
один или несколько пробелов или символов табуляции
comma
запятая
bar
вертикальная черта «|»
Другие
Есть возможность определить как разделитель любую последовательность символов. Скажем, sep="%%" разобьёт строчку по двойному символу процента.
head
этот атрибут, если есть, указывает, где распологается заголовок таблицы.
top
верхняя запись
left
первая колонка
topleft
и верхняя запись и первая (левая) колонка таблицы.

Также принимаются все атрибуты, которые можно указать в стандартном синтаксисе вики-таблиц, например:

class
Название CSS-стиля таблицы. Стиль применяется к самой таблице, а не к её ячейкам.
Чтобы не видеть убогие стандартные HTML-рамочки, рекомендуется всегда использовать class="wikitable".
Чтобы применить стиль к ячейкам, нужно определить класс .className td. Например, чтобы выровнять все ячейки по левому краю, нужно добавить на страницу следующий текст: 
<html><style>.classname td { text-align: right; }</style></html>
border
Толщина границ, попадает в HTML-атрибут таблицы. Подобные границы выглядят убого, лучше используйте класс simpletable.
cellpadding
Ширина поля между значениями ячеек и границами ячеек.

И наконец, добавляя к class слово sortable, можно делать динамически сортируемые таблицы:

EMP_NODEPT_NOPRO_NOEMP_BDATEEMP_SALEMP_BONUS
24411155195516000.0014000.00
2442120196014000.00NULL
24431NULL196016000.0013000.00
24521155NULL15000.0014000.00
24531234NULL17000.00NULL
24442177197017000.0016000.00

Таблицы в стандартном синтаксисе MediaWiki

Любая таблица в wiki-стиле начинается с фигурной скобки { с последующей вертикальной чертой | и заканчивается вертикальной чертой | с закрывающей фигурной скобкой }. Каждая ячейка строки начинается вертикальной черточки |, после которой пишется ее содержание.

Пример: Таблица с одной строкой пишется так: 

{|
 |Ячейка 1
 |Ячейка 2
 |Ячейка 3
 |}

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

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

Для введения следующей строки после вертикальной черточки ставится штрих «-». Таким образом можно вводить любое количество строк.

Пример: Таблица в две строки пишется так: 

{|
 |Ячейка 1*1
 |Ячейка 2*1
 |Ячейка 3*1
 |-
 |Ячейка 1*2
 |Ячейка 2*2
 |Ячейка 3*2
 |}

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

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

Таблица в три строки пишется так: 

{|
 |Ячейка 1*1
 |Ячейка 2*1
 |Ячейка 3*1
 |-
 |Ячейка 1*2
 |Ячейка 2*2
 |Ячейка 3*2
 |-
 |Ячейка 1*3
 |Ячейка 2*3
 |Ячейка 3*3
 |}

А в CustisWiki это будет выглядеть так:

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

И так далее.

Табличные рамки

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

Однако, вместо border=1 рекомендуется опять-таки просто использовать class=wikitable — выглядит куда симпатичнее.

Пример: Для последней таблицы рамку можно создать так:

border=1 class=wikitable
Код 
{| border=1
 |Ячейка 1*1
 |Ячейка 2*1
 |Ячейка 3*1
 |-
 |Ячейка 1*2
 |Ячейка 2*2
 |Ячейка 3*2
 |-
 |Ячейка 1*3
 |Ячейка 2*3
 |Ячейка 3*3
 |}

{| class=wikitable
 |Ячейка 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
Ячейка 1*1 Ячейка 2*1 Ячейка 3*1
Ячейка 1*2 Ячейка 2*2 Ячейка 3*2
Ячейка 1*3 Ячейка 2*3 Ячейка 3*3

Заголовки

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

Пример:

Для последней таблицы можно написать так: 

{| class=wikitable
 !Первый столбец
 !Второй столбец
 !Третий столбец
 |-
 !Первая строчка
 |Ячейка 2*1
 |Ячейка 3*1
 |-
 !Вторая строчка
 |Ячейка 2*2
 |Ячейка 3*2
 |-
 !Третья строчка
 |Ячейка 2*3
 |Ячейка 3*3
 |}

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

Первый столбец Второй столбец Третий столбец
Первая строчка Ячейка 2*1 Ячейка 3*1
Вторая строчка Ячейка 2*2 Ячейка 3*2
Третья строчка Ячейка 2*3 Ячейка 3*3

Запись в одну строчку

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

Пример: Для последней таблицы можно написать так: 

{| class=wikitable
 !Первый столбец||Второй столбец||Третий столбец
 |-
 |Ячейка 1*1||Ячейка 2*1||Ячейка 3*1
 |-
 |Ячейка 1*2||Ячейка 2*2||Ячейка 3*2
 |-
 |Ячейка 1*3||Ячейка 2*3||Ячейка 3*3
 |}

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

Первый столбец Второй столбец Третий столбец
Ячейка 1*1 Ячейка 2*1 Ячейка 3*1
Ячейка 1*2 Ячейка 2*2 Ячейка 3*2
Ячейка 1*3 Ячейка 2*3 Ячейка 3*3

Объединённые ячейки

В wiki-стиле, как и в HTML, имеется возможность «растягивать» ячейки как по вертикали, так и по горизонтали.

Для слияния ячеек по вертикали применяется атрибут rowspan=n, где «n» — число ячеек, на которые должна «тянуться» данная ячейка. Этот атрибут вписывается перед содержанием «растягиваемой» ячейки.

Пример: Вертикальное слияние двух ячеек пишется так: 

{| class=wikitable
 |Ячейка 1
 |rowspan=2 |Ячейка 2, растянута
 |Ячейка 3
 |-
 |Ячейка 4
 |Ячейка 5
 |}

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

Ячейка 1 Ячейка 2, растянута Ячейка 3
Ячейка 4 Ячейка 5

Для горизонтального слияния используется атрибут colspan=n.

Пример: 

{| class=wikitable
 |Ячейка 1
 |colspan=2 |Ячейка 2, растянута
 |-
 |Ячейка 3
 |Ячейка 4
 |Ячейка 5
 |}

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

Ячейка 1 Ячейка 2, растянута
Ячейка 3 Ячейка 4 Ячейка 5

«Раскраска» таблиц

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

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

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

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

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

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

Сделать цветную ячейку можно с помощью атрибута «bgcolor=#ABCDEF», где «ABCDEF» обозначает, как вы уже, наверное, догадались, индекс цвета в Таблице цветов. 

Пример:
Для "раскраски" одной ячейки пишется так:
{| class=wikitable
 |Ячейка 1*1
 |bgcolor=#FFCC00|Ячейка 2*1
 |Ячейка 3*1
 |-
 |Ячейка 1*2
 |Ячейка 2*2
 |Ячейка 3*2
 |-
 |bgcolor=#CCFF00|Ячейка 1*3
 |Ячейка 2*3
 |Ячейка 3*3
 |}

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

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

Вложенные таблицы

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

Пример:
{| border=1
 |Ячейка 1
 |
 {| border=2
 |Ячейка A
 |-
 |Ячейка B
 |}
 |Ячейка 3
 |}

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

Ячейка 1
Ячейка A
Ячейка B
Ячейка 3

Название таблицы

Чтобы название таблицы было отцентрировано по ее ширине, нужно после вертикальной чёрточки поставить знак «+». Само название можно форматировать обычными wiki-атрибутами. 

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

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

Очень длинное-длинное название таблицы.
Ячейка 1 Ячейка 2
Ячейка 3 Ячейка 4

Ширина таблицы

Если, например, подряд идут несколько отдельных таблиц, то желательно, чтобы ширина их была одинаковой, не зависимо от их содержания. Для фиксации ширины таблицы применяется атрибут 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

Импорт таблиц из внешних приложений в вики-синтаксис

Иногда возникает задача импорта сложных таблиц из Office-приложений (MS Word, MS Excel, Open Office).

«Сложные» таблицы — это таблицы, имеющие различные стили ячеек и/или объединённые ячейки.

С помощью wikEd — просто, но некрасиво

  1. Используем Firefox, Chrome или Safari.
  2. Включаем wikEd, если оный выключен (кнопочка с карандашом в правом верхнем углу страницы).
  3. Делаем Copy-Paste таблицы в статью.
  4. Нажимаем кнопку [W] — Wikify, выглядит она так: WikEd wikify.png.

Ручками — сложнее, но красивее

Нужно:

  • добиться сохранения таблицы в HTML-формате (например, скопировать таблицу из MS Excel в MS Word, сохранить в формате «web-page filtered»).
  • «Почистить» таблицу от лишних тэгов и атрибутов с помощью программы Tidy. Примерный вызов Tidy для HTML таблицы из сохраненной из «MS Word» следующий:
tidy -raw -i -m -wrap 256 -bare --word-2000 yes %1
  • Вставить полученную (очищенную и отформатированную) HTML-таблицу в статью.

Таблицы в машинописном стиле без форматирования

Последний способ создать таблицу — это написать ее в машинописном стиле, с помощью преформатированных блоков. Столбцы и общий вид форматируются визуально. Например: 

                                       Климатическая таблица

Месяцы:            январь февраль март апрель май июнь июль август сентябрь октябрь ноябрь декабрь
--------------------------------------------------------------------------------------------------
Дневная температура  21     21      22    23  25   27    29    28     26      24      22     20
Ночная температура   15     15      15    16  17   17    18    17     16      15      15     14
Солнечные часы/день   6      6       7     8   9    9     9     8      7       7       6      6
Дождливые дни/месяц   6      4       3     2   2    1     0     0      2       5       6      7
Температура воды     19     18      18    18  19   20    21     23    20      18      18     18

Внимание! Эта статья была создана путем автоматического реплицирования из внутренней базы знаний компании Заказные Информ Системы. Любые правки этой статьи могут быть перезаписаны при следующем сеансе репликации. Если у вас есть серьезное замечание по тексту статьи, запишите его в раздел «discussion».

Внимание! Данная статья выбрана для репликации в SMWiki.
Статья реплицируется в Wiki4IntraNet.
Источник — «http://lib.custis.ru/index.php?title=Справка:Таблицы&oldid=42823»