|
|
Строка 1: |
Строка 1: |
| Настоящая статья представляет собой немного упрощенную статью [http://www.mediawiki.org/wiki/Help:Tables/ru вот отсюда] автор просит не бить его сильно за явный плагиат. | | ''Настоящая статья представляет собой немного упрощенный вариант, взятый [http://www.mediawiki.org/wiki/Help:Tables/ru вот отсюда]. Анонимус просит не бить его сильно за явный плагиат.'' |
|
| |
|
| На страницах Орлеца можно использовать таблицы, созданные как с помощью табличных тэгов HTML, так и используя специальную вики-разметку. | | На страницах Орлеца можно использовать таблицы, созданные как с помощью табличных тэгов HTML, так и используя специальную вики-разметку. |
Настоящая статья представляет собой немного упрощенный вариант, взятый вот отсюда. Анонимус просит не бить его сильно за явный плагиат.
На страницах Орлеца можно использовать таблицы, созданные как с помощью табличных тэгов HTML, так и используя специальную вики-разметку.
Если ты невъебенный программист, то прекрасно знаешь, что Яндекс пока не отменили. Использование html-тэгов описано в сети достаточно подробно и здесь обсуждаться не будет.
Преимущества вики-разметки состоит в том, что таблица обозначается символами, и при редактировании представить себе структуру таблицы удобнее, чем при использовании тэгов.
Добрый совет — не используйте таблицы, если без них можно обойтись. Табличная разметка часто усложняет редактирование страницы.
Вики-разметка таблиц
{| |
начало таблицы
|
|+ |
заголовок таблицы, необязательно; только один на таблицу, между началом таблицы и первой строкой
|
|- |
строка таблицы, в первой строке необязательно -- движок вики сам подставит первую строку
|
! |
заглавная ячейка, необязательно. Последовательность заглавных ячеек можно записывать на одной строке, с двойными разделителями (!!) или начинать с новой строки, каждую со своим знаком (!).
|
| |
ячейка данных, требуется! Последовательность заглавных ячеек можно записывать на одной строке, с двойными разделителями (||) или начинать с новой строки, каждую со своим знаком (|).
|
|} |
конец таблицы
|
- Вышеприведенные знаки должны начинаться с новой строки, кроме двойных || и !! для последовательности ячеек.
- Атрибуты XHTML. Каждый знак разметки, кроме конца таблицы, может иметь при себе один или несколько атрибутов XHTML.
- У ячеек и заголовка (| или ||, ! или !!, и |+) есть содержимое. Содержимое от атрибутов тэга отделяется вертикальной чертой (|). Содержимое может располагаться в той же строке или в следующих строках.
- У меток таблицы и строки таблицы ({| и |-) нет содержимого. Не ставьте вертикальную черту (|) после их необязательных атрибутов! Если вы по ошибке поставите черту после атрибутов таблицы или строки, парсер удалит её и последний атрибут, если он был рядом с ошибочной чертой.
- Содержимое может располагаться а) за знаком ячейки в той же строке после необязательных XHTML атрибутов или б) на строках под знаком ячейки. Содержимое, использующее вики-разметку, которая должна сама начинаться с новой строки, например, списки, заголовки или вложенные таблицы, разумеется, должно начинаться с новой строки.
Простая таблица
Обычная
В нижеприведенной таблице нет границ и правильной разбивки, она демонстрирует простейшую табличную структуру с вики-разметкой.
Апельсин
|
Яблоко
|
Хлеб
|
Булка
|
Масло
|
Мороженое
|
|
{|
|Апельсин
|Яблоко
|-
|Хлеб
|Булка
|-
|Масло
|Мороженое
|}
|
Альтернатива
Для более табличного вида ячейки можно записывать в одну строчку, разделяя их ||. Это не будет хорошо смотреться в случае большого содержимого, например, целых абзацев. Однако, это хорошо подходит для небольших данных, как в таблице из примера.
Внутри вики-разметки можно ставить дополнительные пробелы, как в примере ниже, чтобы сама разметка смотрелась лучше, но на вид таблицы-результата это не повлияет.
В эту таблицу можно было бы добавить HTML атрибуты, но для простоты обойдёмся без них.
Апельсин |
Яблоко |
и т.д.
|
Хлеб |
Булка |
и т.д.
|
Масло |
Мороженое |
и т.д.
|
|
{|
| Апельсин || Яблоко || и т.д.
|-
| Хлеб || Булка || и т.д.
|-
| Масло || Мороженое || и т.д.
|}
|
С HTML атрибутами
Вы можете добавить HTML атрибуты, чтобы таблица смотрелась лучше
border="1"
Апельсин
|
Яблоко
|
Хлеб
|
Булка
|
Масло
|
Мороженое
|
|
{| border="1"
|Апельсин
|Яблоко
|-
|Хлеб
|Булка
|-
|Масло
|Мороженое
|}
|
align="center" border="1"
Апельсин
|
Яблоко
|
Хлеб
|
Булка
|
Масло
|
Мороженое
|
|
{| align="center" border="1"
|Апельсин
|Яблоко
|-
|Хлеб
|Булка
|-
|Масло
|Мороженое
|}
|
align="right" border="1"
Вы можете указывать атрибуты для отдельных ячеек. Например, числа лучше выравнивать вправо.
Апельсин
|
Яблоко
|
12,333.00
|
Хлеб
|
Булка
|
500.00
|
Масло
|
Мороженое
|
1.00
|
|
{| border="1"
|Апельсин
|Яблоко
|align="right"|12,333.00
|-
|Хлеб
|Булка
|align="right"|500.00
|-
|Масло
|Мороженое
|align="right"|1.00
|}
|
Можно использовать атрибуты в отдельных строках.
Апельсин
|
Яблоко
|
12,333.00
|
Хлеб
|
Булка
|
500.00
|
Масло
|
Мороженое
|
1.00
|
|
{| border="1"
|Апельсин
|Яблоко
|align="right"|12,333.00
|-
|Хлеб
|Булка
|align="right"|500.00
|- style="font-style:italic;color:green;"
|Масло
|Мороженое
|align="right"|1.00
|}
|
cellspacing="0" border="1"
Апельсин
|
Яблоко
|
Хлеб
|
Булка
|
Масло
|
Мороженое
|
|
{| cellspacing="0" border="1"
|Апельсин
|Яблоко
|-
|Хлеб
|Булка
|-
|Масло
|Мороженое
|}
|
cellpadding="20" cellspacing="0" border="1"
Апельсин
|
Яблоко
|
Хлеб
|
Булка
|
Масло
|
Мороженое
|
|
{| cellpadding="20" cellspacing="0" border="1"
|Апельсин
|Яблоко
|-
|Хлеб
|Булка
|-
|Масло
|Мороженое
|}
|
С HTML атрибутами и стилями CSS
Стили CSS можно использовать вместе с другими HTML атрибутами или отдельно.
style="color:green;background-color:#ffffcc;" cellpadding="20" cellspacing="0" border="1"
Апельсин
|
Яблоко
|
Хлеб
|
Булка
|
Масло
|
Мороженое
|
|
{| style="color:green;background-color:#ffffcc;" cellpadding="20" cellspacing="0" border="1"
|Апельсин
|Яблоко
|-
|Хлеб
|Булка
|-
|Масло
|Мороженое
|}
|
Таблица с заголовками TH
Для создания TH (заглавной ячейки таблицы в HTML) используйте ! вместо |. Заглавная ячейка обычно выделяется жирным и центрирована по умолчанию.
Заголовки столбцов
В каждом столбце
Вкусно
|
Вкуснее
|
Апельсин
|
Яблоко
|
Хлеб
|
Булка
|
Масло
|
Мороженое
|
|
{| border="1" cellpadding="20" cellspacing="0"
!Вкусно
!Вкуснее
|-
|Апельсин
|Яблоко
|-
|Хлеб
|Булка
|-
|Масло
|Мороженое
|}
|
Colspan="2"
Вкусные
|
Апельсин
|
Яблоко
|
Хлеб
|
Булка
|
Масло
|
Мороженое
|
|
{| border="1" cellpadding="20" cellspacing="0"
! colspan="2"|Вкусные
|-
|Апельсин
|Яблоко
|-
|Хлеб
|Булка
|-
|Масло
|Мороженое
|}
|
Заголовки строк
По умолчанию
Фрукт
|
Апельсин
|
Яблоко
|
Еда
|
Хлеб
|
Булка
|
Добавка
|
Масло
|
Мороженое
|
|
{| border="1" cellpadding="20" cellspacing="0"
!Фрукт
|Апельсин
|Яблоко
|-
!Еда
|Хлеб
|Булка
|-
!Добавка
|Масло
|Мороженое
|}
|
Выравнивание вправо
Заголовки строк, выровненные вправо, можно сделать так:
Фрукт
|
Апельсин
|
Яблоко
|
Еда
|
Хлеб
|
Булка
|
Добавка
|
Масло
|
Мороженое
|
|
{| border="1" cellpadding="20" cellspacing="0"
!align="right" |Фрукт
|Апельсин
|Яблоко
|-
!align="right" |Еда
|Хлеб
|Булка
|-
!align="right" |Добавка
|Масло
|Мороженое
|}
|
Заглавие таблицы
Заглавие наверху таблицы можно добавить так:
Продукты
Апельсин
|
Яблоко
|
Хлеб
|
Булка
|
Масло
|
Мороженое
|
|
{| border="1" cellpadding="20" cellspacing="0"
|+Продукты
|-
|Апельсин
|Яблоко
|-
|Хлеб
|Булка
|-
|Масло
|Мороженое
|}
|
В заглавие тоже можно добавить атрибуты.
Продукты
Апельсин
|
Яблоко
|
Хлеб
|
Булка
|
Масло
|
Мороженое
|
|
{| border="1" cellpadding="20" cellspacing="0"
|+align="bottom" style="color:#e76700;"|''Продукты''
|-
|Апельсин
|Яблоко
|-
|Хлеб
|Булка
|-
|Масло
|Мороженое
|}
|
Заголовки H1, H2, H3 и т.д.
HTML-заголовки H1, H2, H3, H4 и т.д. могут быть созданы с помощью обычной вики-разметки со знаками ==равенства== и должны быть целиком в одну строку.
Предпросмотр всей таблицы. Если вы нажмёте на кнопку правки внутри таблицы, и в режиме редактирования выберите предпросмотр, таблица отобразится неправильно, так как часть её отсутствует.
Следите за совместимостью иерархии заголовков с остальной частью страницы, чтобы оглавление наверху страницы отображалось правильно.
Вкуснейшие
|
Апельсин
|
Яблоко
|
Хлеб
|
Булка
|
Масло
|
Мороженое
|
|
{| border="3" cellpadding="20" cellspacing="0"
|colspan="2"|
===Вкуснейшие===
|-
|Апельсин
|Яблоко
|-
|Хлеб
|Булка
|-
|Масло
|Мороженое
|}
|
Предупреждение
Отрицательные числа
Отрицательные числа или знак минус (обозначающий отсутствие какого-либо значения) может нарушить таблицу, если ячейка начинается с новой строки (|-6), потому что это воспринимается вики как начало новой строки в таблице, а не новой ячейки. Чтобы избежать такой проблемы, ставьте пробел перед минусом (| -6) или воспользуйтесь внутристроковой разметкой (||-6).