DokuWiki

It's better when it's simple

Инструменты пользователя

Инструменты сайта


ru:devel:css

Таблицы стилей CSS

Многое в отображении «ДокуВики» контролируется через таблицы стилей CSS. «ДокуВики» сама по себе определяет очень ограниченный набор стилей. Остальные описания CSS берутся из используемых шаблонов и плагинов.

Все файлы CSS предоставляются через единый диспетчер в lib/exe/css.php, который, кроме того, управляет кэшированием, заменами по маске и оптимизацией. Загрузка таблиц стилей производится (наряду с другими вещами) функцией tpl_metaheaders(), так что не забывайте включить её в свой шаблон.

Режимы таблиц стилей

«ДокуВики» знает о пяти типах режимов по умолчанию:

  • screen — этот режим используется при отображении страниц в окне веб-браузера;
  • all — применяется во всех режимах отображения;
  • print — определения отсюда будут использоваться при печати страницы;
  • rtl — определения из файлов rtl будут загружены дополнительно, когда используется язык с написанием справа-налево;
  • feed — применяется для отображения новостной ленты.

Таблицы стилей «ДокуВики»

«ДокуВики» загружает таблицы стилей из 4-х источников в следующем порядке (таблицы стилей RTL добавляются в конце каждого шага):

1. Базовые таблицы стилей

Эти таблицы располагаются в /lib/styles. Они определяют базовый стиль, вроде оформления сообщений об ошибках.

2. Стили плагинов

Плагины могут объявить свои собственные определения стиля, используя следующие файлы:

Режим Файл CSS
screen style.css или screen.css
print print.css
all all.css
rtl rtl.css
feed feed.css

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

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

:!: Определённые здесь стили должны позаботиться о возможных конфликтах. Поэтому будьте осторожны при написании плагинов. Если возможно, добавляейте префиксы к названиям ваших стилей для избежания конфликтов.

3. Стили шаблонов

Таблицы стилей шаблонов загружаются из директории выбранного шаблона. «ДокуВики» читает style.ini, расположенный в директории шаблона и загружает все CSS, упомянутые в этом файле. Загрузка происходит в соответствии с текущим режимом.

Дополнительно в файле style.ini определяются подстановки.

4. Пользовательские стили

Независимо от используемого шаблона, администратором вики могут быть определены дополнительные стили с помощью следующих файлов CSS в директории conf/:

Файл CSS в «Муравьеде» Файл CSS после и до «Муравьеда»1) Когда используется
conf/userstyle.css conf/userstyle.css Применяется во всех режимах отображения
conf/printstyle.css conf/userprint.css Применяется при отправке на печать
conf/rtlstyle.css conf/userrtl.css Применяется, если используется языковой интерфейс с написанием справа-налево (right-to-left)
conf/feedstyle.css conf/userfeed.css Applied when displaying the feed
conf/allstyle.css conf/userall.css Applied in all display modes

Это полезно для переопределения небольшой части стилей шаблона или плагина без возникновения проблем при их дальнейшем обновлении.

Использование ID

Когда вы используете произвольный ID в вашем шаблоне для назначения стиля, убедитесь, что этот ID не конфликтует с уже имеющимися. В частности, убедитесь, что нет конфликта с автоматически назначаемыми ID для заголовков разделов. Простейший путь добиться этого — использовать два смежных символа подчерка (__) в вашем ID. Поскольку ID разделов всегда представляют собой допустимое имя статьи, они никогда не будут содержать смежных подчерков.

style.ini

Файл style.ini — это ini-файл. Он содержит два раздела:

[stylesheets]

В этой части определяется какие файлы CSS будут загружены. Каждая строка имеет вид:

cssfile.css = mode

cssfile.css — имя вашего файла; modeрежим, к которому применяется файл.

[replacements]

Диспетчер CSS «ДокуВики» способен заменять подстановки в загружаемый таблицах стилей, которые назначаются в разделе [replacements] в файле style.ini шаблона. Это исключительно полезно для определения цветовых схем в одном месте и дальнейшем использовании их во всех других файлах. После этого смена цветовой схемы сводится к просто редактированию ini-файла.

Гарантированные цветовые подстановки

Только следующие подстановки могут безопасно применяться в плагинах.

Переменная подстановки Назначение Значение в шаблоне по умолчанию Название до 2006-08-05
__background__ основной цвет фона #3D3D3D' | __white__ | ^ __background_alt__ | альтернативный цвет фона | #dee7ec | __medium__ | ^ __background_neu__ | нейтральный цвет фона | #f5f5f5 | __darkgray__ | ^ __border__ | цвет окантовки | #8cacbb | __dark__ | ^ __text__ | основной цвет текста | «#DCDCDC __black__
__text_alt__ альтернативный цвет текста #638c9c __darker__
__text_neu__ нейтральный цвет текста #666 __lightgray__

Начиная с 2006-08-05 подстановки были переименованы, их названия стали более корректными семантически. Плагины и шаблоны, использующие подстановки написанные после этого, могут даже не адаптироваться к старым переменным, но всё же желательно это делать.

Другие цветовые подстановки, используемые шаблоном по умолчанию

Эти дополнительные подстановки используются в шаблоне по умолчанию. Другие шаблоны также могут использовать их, но не обязаны делать это.

Переменная подстановки Назначение Значение в шаблоне по умолчанию Название до 2006-08-05
__background_other__ другой цвет фона #f7f9fa __lighter__
__text_other__ другой цвет текста #ccc __mediumgray__
(none, omitted) - #eef3f8 __light__
__extern__ цвет ссылки #436976 (не менялось)
__existing__ цвет для существующих внутренних ссылок #090 (не менялось)
__missing__ цвет для несуществующих внутренних ссылок #f30 (не менялось)
__highlight__ цвет для подсвечивания найденых кусков текста #ff9 (не менялось)
1)
changed back on 2011-02-26
ru/devel/css.txt · Последнее изменение: 2024-05-16 23:51 — 62.122.241.23

Если не указано иное, содержимое этой вики предоставляется на условиях следующей лицензии: CC Attribution-Share Alike 4.0 International
CC Attribution-Share Alike 4.0 International Donate Powered by PHP Valid HTML5 Valid CSS Driven by DokuWiki