Difference between revisions of "Help:Таблицы"
(→«Раскраска» таблиц) |
|||
Line 543: | Line 543: | ||
[[Category:Справка]] | [[Category:Справка]] | ||
{{replicate-from-custiswiki-to-lib}} | {{replicate-from-custiswiki-to-lib}} | ||
− | {{replicate-from-custiswiki-to- | + | {{replicate-from-custiswiki-to-smwiki}} |
{{replicate-from-custiswiki-to-4intranet}} | {{replicate-from-custiswiki-to-4intranet}} |
Revision as of 17:47, 20 September 2013
Таблицы являются удобной формой для отображения информации. Но таблицы выполняют лишь тогда свою цель, когда между строчками и столбцами имеется смысловая связь, т. е. информацию в них можно рассортировать неким образом, например, по дате или алфавиту.
С другой стороны, таблицы сложнее обычного текста. Так что применять их имеет смысл лишь там, где они действительно улучшают восприятие материала. Поэтому предварительно обдумывайте: не лучше ли использовать обычный список.
Contents
- 1 Расширение SimpleTable
- 2 Таблицы в стандартном синтаксисе MediaWiki
- 3 Таблицы в машинописном стиле без форматирования
Расширение SimpleTable
Простейший способ с минимумом «шумовых» символов и с соблюдением модели «строка таблицы=строка текста» — это использование расширения SimpleTable и тега «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>
Месяцы: | январь | февраль | март | апрель | май | июнь | июль | август | сентябрь | октябрь | ноябрь | декабрь |
---|---|---|---|---|---|---|---|---|---|---|---|---|
Дневная_температура | 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», обрабатываемые самим 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>
- Чтобы применить стиль к ячейкам, нужно определить класс .className td. Например, чтобы выровнять все ячейки по левому краю, нужно добавить на страницу следующий текст:
- border
- Толщина границ, попадает в HTML-атрибут таблицы. Подобные границы выглядят убого, лучше используйте класс simpletable.
- cellpadding
- Ширина поля между значениями ячеек и границами ячеек.
И наконец, добавляя к class слово sortable, можно делать динамически сортируемые таблицы:
EMP_NO | DEPT_NO | PRO_NO | EMP_BDATE | EMP_SAL | EMP_BONUS |
---|---|---|---|---|---|
2441 | 1 | 155 | 1955 | 16000.00 | 14000.00 |
2442 | 1 | 20 | 1960 | 14000.00 | NULL |
2443 | 1 | NULL | 1960 | 16000.00 | 13000.00 |
2452 | 1 | 155 | NULL | 15000.00 | 14000.00 |
2453 | 1 | 234 | NULL | 17000.00 | NULL |
2444 | 2 | 177 | 1970 | 17000.00 | 16000.00 |
Таблицы в стандартном синтаксисе MediaWiki
Любая таблица в wiki-стиле начинается с фигурной скобки { с последующей вертикальной чертой | и заканчивается вертикальной чертой | с закрывающей фигурной скобкой }. Каждая ячейка строки начинается вертикальной черточки |, после которой пишется ее содержание.
Пример: Таблица с одной строкой пишется так:
{| |Ячейка 1 |Ячейка 2 |Ячейка 3 |}
В Wiki4Intranet это будет выглядеть так:
Ячейка 1 | Ячейка 2 | Ячейка 3 |
Для введения следующей строки после вертикальной черточки ставится штрих «-». Таким образом можно вводить любое количество строк.
Пример: Таблица в две строки пишется так:
{| |Ячейка 1*1 |Ячейка 2*1 |Ячейка 3*1 |- |Ячейка 1*2 |Ячейка 2*2 |Ячейка 3*2 |}
В Wiki4Intranet это будет выглядеть так:
Ячейка 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 |}
А в Wiki4Intranet это будет выглядеть так:
Ячейка 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 |} | ||||||||||||||||||
Результат |
|
|
Заголовки
Чтобы содержание ячейки выделялись жирным шрифтом и отцентрированны, вместо вертикальных чёрточек ставятся восклицательные знаки. Это можно применять для выделения заголовков.
Пример:
Для последней таблицы можно написать так:
{| class=wikitable !Первый столбец !Второй столбец !Третий столбец |- !Первая строчка |Ячейка 2*1 |Ячейка 3*1 |- !Вторая строчка |Ячейка 2*2 |Ячейка 3*2 |- !Третья строчка |Ячейка 2*3 |Ячейка 3*3 |}
В Wiki4Intranet это будет выглядеть следующим образом:
Первый столбец | Второй столбец | Третий столбец |
---|---|---|
Первая строчка | Ячейка 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 |}
В Wiki4Intranet это будет выглядеть следующим образом:
Первый столбец | Второй столбец | Третий столбец |
---|---|---|
Ячейка 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 |}
В Wiki4Intranet это будет выглядеть следующим образом:
Ячейка 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 |}
В Wiki4Intranet это будет выглядеть следующим образом:
Ячейка 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 |
|
Ячейка 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 - long - long- long- long- long | Ячейка 1*2 |
Ячейка 1*3 | Ячейка 1*4 |
Ячейка 2*1 | Ячейка 2*2 |
Ячейка 2*3 | Ячейка 2*4 |
Импорт таблиц из внешних приложений в вики-синтаксис
Иногда возникает задача импорта сложных таблиц из Office-приложений (MS Word, MS Excel, Open Office).
«Сложные» таблицы — это таблицы, имеющие различные стили ячеек и/или объединённые ячейки.
С помощью wikEd — просто, но некрасиво
- Используем Firefox, Chrome или Safari.
- Включаем wikEd, если оный выключен (кнопочка с карандашом в правом верхнем углу страницы).
- Делаем Copy-Paste таблицы в статью.
- Нажимаем кнопку [W] — Wikify, выглядит она так: .
Ручками — сложнее, но красивее
Нужно:
- добиться сохранения таблицы в 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
Внимание! Данная статья выбрана для репликации во внешнюю базу знаний компании. Пожалуйста, не допускайте в этой статье публикацию конфиденциальной информации, ведения обсуждений в теле статьи, и более ответственно относитесь к качеству самой статьи — проверяйте орфографию, пишите по-русски, избегайте непроверенной вами информации.
Внимание! Данная статья выбрана для репликации в SMWiki.
Статья реплицируется в Wiki4IntraNet.