Пожалуйста, экспериментируйте в песочнице!
авторам (основы)
Основы стилей
ВикиСтили позволяют авторам изменять цвет и другие параметры оформления содержимого страниц. Викистили пишутся между знаками процента, как например %red%
или %bgcolor=blue%
.
Чаще всего викистили применяют для изменения параметров текста, таких как цвет, фон и шрифт. В PmWiki определено несколько стилей для изменения цвета текста: %white%, %yellow% , %silver%, %gray%, %green%, %purple%, %red%, %blue%, %maroon%, %navy% и %black%.
В вазе лежали %red% яблоки, %blue% голубика, %purple% баклажаны, %green% зелень %% и прочее. |
В вазе лежали яблоки, голубика, баклажаны, зелень и прочее. |
Для задания своего цвета используйте викистиль %color=...%
. (Примечание: Чтобы избежать срабатывания WikiWord для RGB цвета (#rrggbb) всегда необходимо применять строчные буквы)
Мне бы тоже хотелось поесть %color=#ff7f00%мандаринов%%! |
Мне бы тоже хотелось поесть мандаринов! |
Для изменения цвета фона используется %bgcolor=...%
.
В этом предложении текст %bgcolor=green yellow% жёлтого цвета на зелёном фоне. |
В этом предложении текст жёлтого цвета на зелёном фоне. |
Смотри PmWiki:WikiStyleColors для большего числа примеров цветов.
Область действия
Викистили также могут указывать область действия. Когда она не указана - викистиль действует на текст до следующего викистиля или до конца параграфа. Заданая явно область действия может быть целым параграфом (%p ...%
), всем списком (%list ...%
), элементом списка (%item ...%
) или любым блоком (%block ...%
).
%p bgcolor=#ffeeee% Викистиль в начале этой строки воздействует на весь параграф, даже если он %blue% содержит другой стиль %% посреди него самого. |
Викистиль в начале этой строки воздействует на весь параграф, даже если он содержит другой стиль посреди него самого. |
Модуль >>style<<
используется для стилизации большего набора элементов. Её действие продолжается до того пока не встретится >><<
.
>>blue font-style=italic bgcolor=#ffffcc<< Всё после предыдущей строки стилизовано под синий курсив Включая преформатированый текст * списки -> строки с отступом >><< |
Всё после предыдущей строки стилизовано под синий курсив Включая преформатированый текст
строки с отступом
|
Атрибуты викистилей
Атрибуты работающие в определениях викистилей:
------------ CSS ------------- --HTML-- color bgcolor class background-color margin id text-align padding hspace text-decoration border vspace font-size float target font-family list-style rel font-weight width* accesskey font-style height* value Специальные: define, apply
Атрибуты в первых двух колонках соответствуют одноимённым свойствам cascading style sheet (CSS). Атрибуты последней колонки действуют только на определённые элементы:
class=
иid=
назначают HTML элементу CSS класс или идентификаторtarget=name
открывает последующие ссылки в окне броузера с именем "name"rel=name
для ссылки указывает родство с указываемым документомaccesskey=x
назначает 'x' на роль горячей клавиши для последующей ссылкиvalue=9
устанавливает номер текущего элемента нумерованого списка
* Атрибуты width и height помечены звёздочкой потому что для тэга <img .../> они работают по особому. Т.е. если их использовать отдельно от других атрибутов (между процентами), тогда они устанавливают ширину('width=') и высоту('height=') для любого последующего тэга <img ... />. В ином случае, они определяют (ширину)'width:' и (высоту)'height:' элементов через CSS.
Применение викистилей к блокам
Обычно стиль воздействует только на фрагмент текста (в строке), но атрибут apply= позволяет стилю воздействовать на что-то большее. Предопределённые значения apply= такие:
apply=img | стиль воздействует на все последующие изображения | |
apply=p | стиль воздействует на текущий параграф | * |
apply=pre | стиль воздействует на текущий преформатированый текст | |
apply=list | стиль воздействует на текущий список | * |
apply=item | стиль воздействует на текущий элемент списка | * |
apply=div | стиль воздействует на текущий сегмент(div) | |
apply=block | стиль воздействует на текущий блок (параграф, список, элемент списка, заголовок или сегмент(div)) | * |
Строки помеченые звёздочкой обладают уже определёнными сокращениями стилей, какими как %p color=blue%
- тоже самое что и %apply=p color=blue%
и %list ROMAN%
тоже что и %apply=list list-style=upper-roman%
.
Некоторые сокращения стилей также применяют apply, соответственно %right%
это сокращение для %text-align=right apply=block%
.
Воздействие стиля имеет эффект только тогда, когда он расположен на первой строке блока. Другими словами, стиль в третьей строке параграфа не может изменить атрибуты параграфа.
здесь некий текст в параграфе и если мы попробуем %apply=p color=blue% изменить цвет параграфа по середине, то он не сработает потому что стиль поступил уже после того как параграф был начат. |
здесь некий текст в параграфе и если мы попробуем изменить цвет параграфа по середине, то он не сработает потому что стиль поступил уже после того как параграф был начат. |
Однако, этот %p color=red% параграф ''будет'' красным, потому что блок стиля указан в первой строке этого текта. |
Однако, этот параграф будет красным, потому что блок стиля указан в первой строке этого текта. |
* Элемент списка * %list red% Упс, слишком поздно воздействовать на список! |
|
Включение стилей
Стили не описаные выше могут быть разрешены администратором путём изменения файла local/config.php. К примеру, для разрешения атрибута стиля "line-height" добавьте в указаный файл следующую строчку:
$WikiStyleCSS[] = 'line-height';
Собственные сокращения стилей
Атрибут define=
применяется для назначения сокращённого имени любому определению викистиля. Это сокращение можно будет применить в других определениях стилей.
%define=box block bgcolor=#ddddff border="2px dotted blue"% %box% [@ $ echo "Привет всем" Привет всем $ exit @] %box font-weight=bold color=green% [@ $ echo "Я сказал - ПРИВЕТ!" @] |
$ echo "Привет всем" Привет всем $ exit $ echo "Я сказал - ПРИВЕТ!" |
Совет: Общие определения стилей довольно часто помещают на заглавные страницы групп, так что они могут использоваться сразу по всей группе. Или стили могут предопределены администратором для всего сайта в качестве местных подстроек. (смотри Собственные ВикиСтили).
Совет: Cобственным стилям можно назначать осмысленые имена. К примеру, если все предупреждения обозначаются зелёным цветом, то определите стиль warn(warning->внимание) через %define=warn green%
, и пользуйтесь им вместо %green%
. Тогда, если позднее вы захотите изменить оформление предупреждений, то значительно проще изменить одно определение, чем заменять все %green%
.
Предопределённые сокращения стилей
PmWiki определяет ряд сокращений стилей:
- Цвета текста: black, white, red, yellow, blue, gray, silver, maroon, green, navy, purple (сокращение для
%color=...%
) - Выравнивание:
%center%
(центр) и%right%
(справа) - Изображения и фрагменты
- Фрагмент справа или слева:
%rfloat%
(справа) и%lfloat%
(слева) - Фрагмент в рамке:
%frame%
,%rframe%
(слева) и%lframe%
(справа) - Уменьшить до миниатюры:
%thumb%
- Фрагмент справа или слева:
- Открывать ссылки в новом окне:
%newwin%
(сокращение для%target=_blank%
) - Коментарии:
%comment%
(сокращение для%display=none%
) - Пронумерованые списки:
%decimal%
(числами),%roman%
(прописными римскими числами),%ROMAN%
(заглавными римскими числами),%alpha%
(прописными алфавитный заглавными),%ALPHA%
(заглавными алфавитный заглавными) (ещё смотри Cookbook:OutlineLists)
Примеры
Примеры стилизации содержит ряд примеров использования стилей на страницах.
Известные проблемы
- Проценты в определении стилей (вроде:
%block width=50% %
) надо использовать "pct" вместо "%".
Также смотри
<< Директивы таблиц | Документация | Примеры стилизации >>
Перевод страницы PmWiki.WikiStyles -
Оригинал перевода PmWikiRu.WikiStyles -
Backlinks
PmWikiRu.WikiStyles: редакция от September 10, 2011, at 06:48 PM
PmWiki.WikiStyles: редакция от February 24, 2024, at 07:41 PM