====== Таблицы стилей CSS ====== Многое в отображении <<[[..:dokuwiki|ДокуВики]]>> контролируется через таблицы стилей CSS. <<ДокуВики>> сама по себе определяет очень ограниченный набор стилей. Остальные описания CSS берутся из используемых [[wiki:devel:template|шаблонов]] и [[..:plugins|плагинов]]. Все файлы CSS предоставляются через единый диспетчер в ''lib/exe/css.php'', который, кроме того, управляет кэшированием, заменами по маске и оптимизацией. Загрузка таблиц стилей производится (наряду с другими вещами) функцией ''tpl_metaheaders()'', так что не забывайте включить её в свой шаблон. ===== Режимы таблиц стилей ===== <<ДокуВики>> знает о пяти типах режимов по умолчанию: * **screen** --- этот режим используется при отображении страниц в окне веб-браузера; * **all** --- применяется во всех режимах отображения; * **print** --- определения отсюда будут использоваться при печати страницы; * **rtl** --- определения из файлов ''rtl'' будут загружены дополнительно, когда используется [[wiki:localization|язык]] с написанием справа-налево; * **feed** --- применяется для отображения [[wiki:syndication|новостной ленты]]. ===== Таблицы стилей «ДокуВики» ===== <<ДокуВики>> загружает таблицы стилей из 4-х источников в следующем порядке (таблицы стилей RTL добавляются в конце каждого шага): ==== 1. Базовые таблицы стилей ==== Эти таблицы располагаются в ''/lib/styles''. Они определяют базовый стиль, вроде оформления сообщений об ошибках. ==== 2. Стили плагинов ==== Плагины могут объявить свои собственные определения стиля, используя следующие файлы: ^ Режим ^ Файл CSS ^ | screen | ''style.css'' или ''screen.css'' | | print | ''print.css'' | | all | ''all.css'' | | rtl | ''rtl.css'' | | feed | ''feed.css'' | Чтобы лучше сочетаться с цветовой схемой любого шаблона, авторы плагинов должны использовать [[#гарантированные цветовые подстановки]]. :!: Таблицы стилей плагина загружаются, даже если сам плагин не используется (но не если он [[wiki:config:disableactions|выключен]]). :!: Определённые здесь стили должны позаботиться о возможных конфликтах. Поэтому будьте осторожны при написании плагинов. Если возможно, добавляейте префиксы к названиям ваших стилей для избежания конфликтов. ==== 3. Стили шаблонов ==== Таблицы стилей шаблонов загружаются из директории выбранного шаблона. <<ДокуВики>> читает ''[[#style.ini]]'', расположенный в директории шаблона и загружает все CSS, упомянутые в этом файле. Загрузка происходит в соответствии с [[#режимы таблиц стилей|текущим режимом]]. Дополнительно в файле ''[[#style.ini]]'' определяются [[#подстановки]]. * См. также: <<[[templates|Разработка шаблонов]]>> ==== 4. Пользовательские стили ==== Независимо от используемого шаблона, администратором вики могут быть определены дополнительные стили с помощью следующих файлов CSS в директории ''conf/'': ^ Файл CSS в «[[wiki:changes#релиз_2010-11-07a_муравьед|Муравьеде]]» ^ Файл CSS после и до «Муравьеда»((changed back on 2011-02-26)) ^ Когда используется ^ | ''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 [[:syndication|feed]] | | ''conf/allstyle.css'' | ''conf/userall.css'' | Applied in all display modes | Это полезно для переопределения небольшой части стилей шаблона или плагина без возникновения проблем при их дальнейшем обновлении. ===== Использование ID ===== Когда вы используете произвольный ID в вашем шаблоне для назначения стиля, убедитесь, что этот ID не конфликтует с уже имеющимися. В частности, убедитесь, что нет конфликта с автоматически назначаемыми ID для заголовков разделов. Простейший путь добиться этого --- использовать два смежных символа подчерка (%%__%%) в вашем ID. Поскольку ID разделов всегда представляют собой допустимое [[wiki:pagenames|имя статьи]], они никогда не будут содержать смежных подчерков. ===== style.ini ===== Файл ''style.ini'' --- это [[wp>INI_file|ini-файл]]. Он содержит два раздела: ==== [stylesheets] ==== В этой части определяется какие файлы CSS будут загружены. Каждая строка имеет вид: cssfile.css = mode **cssfile.css** --- имя вашего файла; **mode** --- [[#режимы таблиц стилей|режим]], к которому применяется файл. ==== [replacements] ==== Диспетчер CSS <<ДокуВики>> способен заменять подстановки в загружаемый таблицах стилей, которые назначаются в разделе ''[replacements]'' в файле ''[[#style.ini]]'' шаблона. Это исключительно полезно для определения цветовых схем в одном месте и дальнейшем использовании их во всех других файлах. После этого смена цветовой схемы сводится к просто редактированию ini-файла. === Гарантированные цветовые подстановки === Только следующие подстановки могут безопасно применяться в плагинах. ^Переменная подстановки ^Назначение ^Значение в шаблоне по умолчанию ^Название до 2006-08-05 ^ ^''%%__background__%%'' |основной цвет фона |''#fff'' |''%%__white__%%'' | ^''%%__background_alt__%%'' |альтернативный цвет фона |''#dee7ec'' |''%%__medium__%%'' | ^''%%__background_neu__%%'' |нейтральный цвет фона |''#f5f5f5'' |''%%__darkgray__%%'' | ^''%%__border__%%'' |цвет окантовки |''#8cacbb'' |''%%__dark__%%'' | ^''%%__text__%%'' |основной цвет текста |''#000'' |''%%__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'' |(не менялось) |