HTML в MediaWiki
HTML в MediaWiki — особенности применения языка гипертекстовой разметки HTML в википроектах на основе движка MediaWiki.
Содержание |
[править] Особенности
В MediaWiki при редактировании страниц помимо викиразметки допускается применение некоторых HTML-тегов. Применение HTML обусловлено тем, что HTML расширяет возможности форматирования и оформления внешнего вида викистраниц. Чаще всего HTML-код можно встретить в шаблонах, но работает он и в статьях. Однако использование HTML при этом имеет свои особенности. В википроектах HTML-код взаимодействует с викиразметкой, «волшебными словами» и функциями парсера, и его применение имеет более сложный характер, чем полноценное использование гипертекстовой разметки при создании обычных веб-страниц. При использовании в википроектах вместе с викиразметкой HTML-тегов возможны дополнительные неожиданные эффекты и скрытые ограничения, которые при обычной вёрстке веб-страниц не встречаются.
- Примечание: Кроме HTML-тегов в MediaWiki применяются другие различные теги (<gallery>, <nowiki>, <poem>, <ref> и т. д.), которые не следует путать с HTML-тегами. Они не работают в HTML и HTML-тегами не являются.
[править] HTML-теги, работающие в MediaWiki
Большинство распространённых HTML-тегов работает в коде викистраниц как отдельно, так и в сочетании с викиразметкой. Теги представляют собой парную конструкцию с открывающим и закрывающим тегами (<тег>содержимое</тег>), и заключенным в них содержимым (текстом или блочными элементами), вид которого они меняют. Некоторые теги не являются парными, и имеют вид: <тег>.
- Примечание: По правилам HTML теги могут вкладываться друг в друга, но блочные теги нельзя помещать внутри текстовых.
Теги имеют дополнительные атрибуты, среди которых есть универсальные (работающие во всех тегах), и специфические для конкретных тегов: <тег атрибут="значение">содержимое</тег>
Одним из универсальных атрибутов является атрибут title, который добавляет к элементу всплывающую подсказку с текстом: <тег title="Ваш текст">содержимое</тег>. При наведении курсором мыши на элемент всплывающая подсказка всплывает (пример).
Ещё один важный универсальный атрибут — атрибут style, с помощью которого в теги добавляют встроенные стили CSS: <тег style="стилевое свойство1:значение1; стилевое свойство2:значение2;">содержимое</тег>
Если в HTML есть три типа стилей CSS: встроенные (непосредственно в тегах), глобальные (в заголовке веб-страницы) и связанные (в отдельном файле стилей), то при редактировании страниц википроектов обычный пользователь имеет возможность использовать только встроенные стили или ограниченный набор уже установленных в википроекте связанных стилей, поскольку не может редактировать CSS-файлы и заголовки HTML. При этом связанные стили необходимо предварительно изучить, открыв файлы стилей на сайте википроекта, что требует дополнительных действий.
[править] Заголовки
<h1></h1> — заголовок 1 уровня (блочный элемент)
<h2></h2> — заголовок 2 уровня (блочный элемент)
<h3></h3> — заголовок 3 уровня (блочный элемент)
<h4></h4> — заголовок 4 уровня (блочный элемент)
<h5></h5> — заголовок 5 уровня (блочный элемент)
<h6></h6> — заголовок 6 уровня (блочный элемент)
Все заголовки являются аналогами заголовков викиразметки (== ==, === === и т. д.). Являются блочными элементами: располагаются с новой строки. Отображаются в виде текста крупным шрифтом с подчёркиванием, но без ссылки [править]. Отображаются в блоке «Содержание» викистраницы.
[править] Форматирование текста
Тэг | Описание | Тип | Пример |
---|---|---|---|
<p> </p> |
Абзац с новой строки. Абзацы разделяются отбивкой — увеличенным отступом по вертикали. | блочный элемент |
Абзац 1 текст текст текст текст текст текст. Абзац 2 текст текст текст текст текст текст. |
<span> </span> |
HTML-тег для добавления в текст встроенных стилей (CSS), так называемая стилевая «обёртка» для текста. Работает в MediaWiki. Сам по себе без стилей ничего не делает. При добавлении стилей (<span style=""></span>) может менять внешний вид текста. | строчный элемент |
Например, код <span style="color:red;"></span> сделает текст красным. |
<b> </b> |
Жирный шрифт (физическая разметка). В викиразметке аналогом является Полужирное начертание (''' '''). В отличие от викиразметки (''' '''), которая работает только в одной строке и не работает при переносах строки, в тег <b></b> можно заключать сразу несколько строк, и он работает при наличии переносов. | строчный элемент |
текст |
<strong> </strong> |
Жирный шрифт (логическая разметка). | строчный элемент |
текст |
<i> </i> |
Курсив (физическая разметка). В викиразметке аналогом является Курсивное начертание ('' ''). В отличие от викиразметки ('' ''), которая работает только в одной строке и не работает при переносах строки, в тег <i></i> можно заключать сразу несколько строк, и он работает при наличии переносов. | строчный элемент |
текст |
<em> </em> |
Курсив (логическая разметка). | строчный элемент |
текст |
<tt> </tt> |
Моноширинный шрифт (физическая разметка). | строчный элемент |
текст |
<big> </big> |
Увеличивает размер шрифта. | строчный элемент |
текст |
<small> </small> |
Уменьшает размер шрифта. | строчный элемент |
текст |
<sub> </sub> |
Нижний индекс. | строчный элемент |
текст |
<sup> </sup> |
Верхний индекс. | строчный элемент |
текст |
<<u> </u> |
Подчеркивание текста. | строчный элемент |
текст |
<s> </s> |
Перечеркнутый текст. | строчный элемент |
|
<abbr> </abbr> |
Аббревиатура (подчеркивание пунктиром). | строчный элемент |
текст |
<dfn> </dfn> |
Новый термин в тексте (курсив). | строчный элемент |
текст |
<kbd> </kbd> |
Текст на клавиатуре (моноширинный шрифт). | строчный элемент |
текст |
<samp> </samp> |
Вывод компьютерной программы. | строчный элемент |
текст |
<font> </font> |
Тег, указывающий тип, размер и цвет шрифта. | строчный элемент |
Например, код <font color="green" face="serif" size="5">текст</font> даёт текст: текст |
[править] Цитаты
Тэг | Описание | Тип | Пример |
---|---|---|---|
<blockquote> </blockquote> |
Цитата. Начинается всегда с красной строки. | блочный элемент |
Текст цитаты |
<cite> </cite> |
В этот тег помещается ссылка на источник цитируемого текста. Отображается курсивным шрифтом. Применяется обычно совместно с тегом <blockquote></blockquote>, помещается внутри него. | строчный элемент |
Ссылка на источник цитаты. |
[править] Списки
Списки в HTML являются блочными элементами с новой строки.
Тэг | Описание | Пример |
---|---|---|
<ul> <li>Строка 1</li> <li>Строка 2</li> </ul> |
Маркированный список. В викиразметке его аналогом является символ *, применяемый в начале новой строки. HTML-теги, в отличие от викиразметки, работают не только с новой строки, но и в любом месте. |
|
<ol> <li>Строка 1</li> <li>Строка 2</li> </ol> |
Нумерованный список. В викиразметке его аналогом является символ #, применяемый в начале новой строки. HTML-теги, в отличие от викиразметки, работают не только с новой строки, но и в любом месте. |
|
<dl> <dt>Термин</dt> <dd>Определение термина</dd> </dl> |
Список определений. В викиразметке ему соответствуют символы с новой строки: ;Термин :Определение термина |
|
[править] Таблицы
HTML-теги таблиц, работающие в MediaWiki |
Викиразметка | Значение | ||||||||
---|---|---|---|---|---|---|---|---|---|---|
<table> | {| | Начало таблицы | ||||||||
<caption></caption> | |+ | Заголовок таблицы | ||||||||
<tr></tr> | |- | Строка таблицы | ||||||||
<th></th> | ! | Заголовок столбца | ||||||||
<td></td> | | | Ячейка таблицы | ||||||||
</table> | |} | Конец таблицы | ||||||||
<table> <caption>Заголовок таблицы</caption> |
{| |+Заголовок таблицы |
Код таблицы | ||||||||
|
|
Общий вид таблицы |
[править] Прочие HTML-теги
<div></div> — блочный HTML-тег, являющийся «обёрткой» для своего содержимого, меняющей его отображение на основе стилей (CSS). Работает и в HTML, и в википроектах наряду с викиразметкой.
<br> — перенос строки. В викиразметке применяется как <br />, но работают оба варианта.
<hr> — горизонтальная линия. В викиразметке её аналогом является последовательность ---- с новой строки. Сам этот тег в вики работает, но атрибуты и стилевые свойства для него не работают.
<pre></pre> — отмена форматирования (моноширинный шрифт).
<center></center> — выравнивает содержимое по центру. Работает в MediaWiki и в HTML, но в HTML является устаревшим тегом и не рекомендуется к применению.
<!-- --> — комментарий в коде. Работает как в HTML, так и в викиразметке.
[править] HTML-теги, не работающие в MediaWiki
Следующие HTML-теги не работают при помещении их в коде викистраницы:
Теги <html></html>, <head></head>, <body></body>, <title></title>, <link></link>, <meta></meta> в коде викистраницы всегда отключены.
<acronym></acronym> — акроним (подчеркивание пунктиром).
<q></q> — кавычки.
<a></a> — веб-ссылка. В MediaWiki данный HTML-код не работает, вместо него применяется конструкция [http://www.example.com внешняя ссылка]:
- <a href="URL"></a> — ссылка на URL
- <a name="якорь"></a> — определения якоря внутри страницы. В викиразметке в качестве якорей выступают заголовки разделов. Для произвольной расстановки якорей в теле статьи используется шаблон {{anchor}}.
- <a href="#якорь"></a> — ссылка на якорь. В викиразметке вместо этого используются внутренние ссылки с указанием разделов ([[Название страницы#Раздел]]).
<img> — непарный HTML-тег, размещающий на веб-странице изображение. В MediaWiki не работает. В викиразметке вместо него используется конструкция [[Файл:Имя файла.jpg]], вставляющая на викистранице изображение, предварительно загруженное в википроект.
<thead></thead>, <tfoot></tfoot>, <tbody></tbody>, <col> — табличные HTML-теги, не работающие в коде викистраниц.
<marquee></marquee> — бегущая строка в HTML. В MediaWiki не работает.
[править] Стилевые свойства, не работающие в MediaWiki
В википроектах в случае применения в коде страниц HTML-тегов со встроенными стилями CSS не все стилевые свойства работают:
- background-image: url(путь к файлу) — данное стилевое свойство добавляет в блочный элемент HTML фоновое изображение на основе гиперссылки на файл изображения. Не работает в MediaWiki (в том числе, в теге <div> и HTML-тегах таблиц, в викиразметке таблиц).
- Параметр type="" для тега маркированного списка <ul> имеет фиксированное значение (в Викиреальности это square) и не может быть изменён.
[править] Ссылки
|
HTML в MediaWiki относится к темам: |