WikiDer > Справка: Стиль пользователя - Википедия

Help:User style - Wikipedia
Ярлыки

Пользователь может настраивать шрифты, цвета, расположение ссылок на полях и многое другое! Это делается через кастомные Каскадные таблицы стилей Хранится в подстраницы страницы пользователя "Пользователь".

Например. Чтобы создать свои собственные модификации CSS для кожа вы сейчас используете, создайте страницу на Специально: MyPage / skin.css содержащий CSS, который вы хотите использовать (чтобы применить ваши изменения независимо от того, какой скин вы используете, поместите их в Special: MyPage / common.css вместо). Чтобы узнать, как скрыть определенные сообщения, см. РГ: CSSHIDE.

Общий

Для каждого стиля, определяемого пользователем, кожа сначала выбирается вместе с соответствующей каскадной таблицей стилей (CSS). Для каждого скина пользователь может делать различные варианты выбора шрифтов, цветов, позиций ссылок на полях и т. Д. CSS указывается со ссылкой на селекторы. [1]: HTML-элементы, классы и идентификаторы, указанные в HTML-коде. Соответственно, какие возможности для каждой оболочки можно увидеть, посмотрев на исходный HTML-код страницы, в частности, посмотрев на эти классы и идентификаторы: чем их больше, тем больше универсальность есть.

В самом программном обеспечении MediaWiki есть CSS, и Википедия отменяет это, используя следующие страницы:

CSS для всего сайта находится в MediaWiki: Common.css

Вы можете изменить их для себя, используя пользовательские стили. Чтобы внести изменения, которые применяются независимо от вашего текущего скина, измените свой common.css. Чтобы внести изменения, которые повлияют на ваш текущий скин, измените свой skin.css. Чтобы внести изменения, которые повлияют на все проекты Викимедиа, вы можете войти в Мета и измени свой global.css.

Введите CSS на эту страницу. Предварительный просмотр CSS работает особым образом: он позволяет просматривать поля страницы (а не содержимое) на основе информации о стиле на странице, при условии, что используемый скин - это скин, для которого применяется страница. Это имеет ограничения. Например, можно предварительно просмотреть, как будут выглядеть ссылки на полях, но это могут быть не все типы, которые хотелось бы проверить. После сохранения, оставаясь на странице или на любой другой странице, выполните принудительную перезагрузку (shift-reload / ctrl-f5), чтобы получить новые файлы.

Чтобы импортировать CSS с подстраницы пользователя, используйте mw.loader.load команда в вашем common.js:

 mw.грузчик.нагрузка( '/w/index.php?title=User:Example/stylesheet.css&action=raw&ctype=text/css', 'текст / CSS' );

Рендеринг

Исходный код страницы HTML содержит такие строки, как

 <сценарий src="/w/wiki.phtml?title=User:your-username-here/standard.js&action=raw&ctype=text/javascript"> </сценарий> @import "/style/wikistandard.css"; @import "/w/wiki.phtml?title=User:your-username-here/standard.css& action = raw & ctype = text / css ";

для CSS всего проекта для конкретной оболочки (в данном случае здесь, в Википедии, ссылаясь на //en.wikipedia.org/style/wikistandard.css) и личных JS и CSS для конкретной оболочки.

Таким образом, сервер предоставляет HTML-код, относящийся к файлам CSS и JS, но не выполняет никакой интерпретации их содержимого. Интерпретация выполняется браузером в зависимости от его возможностей и настроек.

CSS

CSS на подстраницах пользователя по сравнению с CSS в локальном файле

В дополнение к вышеуказанному или в качестве альтернативы в браузере можно установить локальный CSS. Если один из них использует несколько браузеров, для каждого может быть установлен другой CSS. Каждый применим ко всей всемирной паутине, а не только к проекту MediaWiki (и не зависит от входа в систему). Однако параметр влияет на другие веб-страницы, только если они используют тот же селектор CSS; например настройка для селектора a.extiw влияет на меньшее количество страниц в Интернете, чем для h2 (но влияет по крайней мере на все проекты MediaWiki, а не только на один).

Для строк CSS, которые должны отличаться в разных проектах MediaWiki, например очевидно, что локальный CSS не может использоваться для другого цвета фона для облегчения различения; по крайней мере, эти строки должны быть помещены на подстраницы пользователя.

Некоторые компьютеры, например в интернет-кафе, на мобильных устройствах / планшетах не позволяйте пользователям настраивать параметры браузера. В этом случае пользовательские подстраницы в любом случае позволяют настроить пользовательский стиль.

Если в браузере задана опция игнорирования размера шрифта, указанного на веб-странице или во внешнем CSS, строки CSS, касающиеся размера шрифта, должны быть помещены в локальный CSS.

Селекторы CSS

Селекторы CSS, выраженные в терминах элементов, классов и идентификаторов, соответствующих стилю тела страницы, включают следующее. По возможности приведены примеры, показывающие результат для текущих настроек стиля:

  • :связь - ссылки - пример: Справка: указатель ; дефолт: помощь: индекс (Видеть а vs: ссылка)
  • :связь:связь
  • :связь:посетил
  • :связь#contentTop
  • :связь.внешний — http: // пример ; дефолт: http: // пример
  • :связь.extiw - межвики-ссылка в теле страницы -; дефолт: ru: пример
  • :связь.изображение - ссылка с полного изображения на страницу описания изображения
  • :связь.внутренний - ссылка на сам файл (Медиа :), а также ссылки из миниатюры и значка увеличительного стекла на страницу описания изображения (обратите внимание, что цвет и размер шрифта, указанные для внутреннего файла, применимы только в первом случае)
  • :связь.новый пример ; дефолт: пример
  • .allpagesredirect – abc - перенаправляет в Special: Allpages и Special: Prefixindex
  • тело.нс-0, ..., тело.нс-15 (пространства имен)
  • div#bodyContent
  • div#содержание столбца
  • div#редактировать раздел
  • div#globalWrapper
  • div#вершина
  • div.токлин
  • h1.firstHeading
  • h2
  • h3
  • img.текс Образ TeX
  • маленький – пример
  • стол.toc

Обычные внутренние ссылки не в классе внутренний (они были и остаются на сайтах, использующих более старую версию программного обеспечения, например [2]); они могут быть стилизованы со ссылкой на :связь и :связь:посетил, в общем, после чего укладка :связь.extiw и т.д. могут предусматривать исключения из этого общего стиля для ссылок.

Для межъязыковых ссылок:

  • {{code | lang = css | code = # p-lang a}}

Также может быть, что стиль зависит от значения атрибута, например с селекторами:

  • : link [title = "Пользователь:имя пользователя"]
  • : ссылка [title = "имя страницы"]
  • : ссылка [href = "полный URL "]

для выделения цветом или выделения определенных пользователей (включая себя) и / или ссылок на определенные страницы (например, выделение жирным шрифтом просматриваемых страниц в разделе «Последние изменения»). Это работает в Opera, но не в IE. Смотрите также Справка: просмотр страниц # CSS.

Список наблюдения и Последние изменения используют два класса:

  • автокомментарий
    пример
  • новый (Смотри ниже)

В истории страницы есть классы автокомментарий и:

  • Пользователь
  • незначительный

Таким образом, шрифт, указанный для Пользователь применяется в истории страницы, но не в списке наблюдения или последних изменениях.

Отредактируйте страницу

  • Поле редактирования: textarea#wpTextbox1
example1
  • Поле редактирования сводки: Вход#wpSummary
пример2

Блоки основных стилей

Видеть meta: Настройка: Explaining_skins

Без отображения

Один крайний «стиль» для текста - его не отображать, с

.имя класса {display: none} #я бы {display: none}

и Т. Д.

Неотображаемые ссылки не работают (в отличие от ссылок, написанных очень мелким шрифтом).

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

Стиль в зависимости от параметра или переменной

Переменный класс или идентификатор

Класс или идентификатор могут зависеть от результата, созданного шаблоном, или от параметра шаблона, например class = "abcdef". Для одного или нескольких возможных имен классов можно определить стиль этого класса. Если класс не определен, он игнорируется, поэтому используется стандартный стиль.

В простейшем случае мы имеем, например, class = "abc {{{1}}}" и определите класс abcdef. Если значение параметра - def, оно применяется.

Если страница для общего использования имеет смысл только тогда, когда стили определены для определенных классов, тогда они должны быть указаны на странице MediaWiki: Common.css, который применяется ко всем пользователям и всем скинам, если не отменен.

Имя переменной HTML-атрибута

Имя атрибута HTML можно сделать переменным. HTML Tidy - устаревшая библиотека HTML4, которая планируется удалить - исторически удалял атрибуты с недопустимыми именами на стороне сервера, поэтому результат не зависит от способности браузера игнорировать недопустимые имена атрибутов, а объем отправляемых данных сокращается. Для переменной с возможным значением "класс" см. Википедия: Скрытая структура и ru: Шаблон: Infobox (обратные ссылки редактировать).

Значение параметра переменного стиля

Викитекст нравится

<охватывать стиль="дисплей: {{{3 | none}}}">Мы бы</охватывать>

отображает «ср», если параметр 3 определен, но не «нет», и ничего не отображает, если параметр 3 не определен или «нет». Если значение параметра 3 - это стиль отображения, отличный от «none», применяется этот стиль.

Образцы

Пользовательские стили можно поместить в личные файлы CSS каждого пользователя, например Special: MyPage / common.css, который каждый пользователь может редактировать, чтобы задать свои собственные стили.

/ * делаем фон за областью содержимого и вкладками светло-серым * /#содержание, #содержание стол#p-реакции ул Ли а { фон: # f5f5f5; }/ * останавливаем прокрутку фонового изображения вместе с областью содержимого * /тело { фоновое приложение: фиксированный; }/ * заменяем книгу в фоновом режиме на что-нибудь другое * /тело { фон: Фиолетовый; }/ * меняет фон пре-областей * /предварительно { фон: белый }/ * меняем логотип * /#p-логотип а { фон: url(https://upload.wikimedia.org/wikipedia/commons/9/93/Color-chars-logo.png) 35% 50% нет повторения; }/ * не используйте логотип, вместо этого переместите поля в эту область * /#p-логотип { отображать: никто }#первая колонка { обивка: 0; }/ * подавить значок человека вашим именем пользователя * /Ли#pt-userpage { фон: никто }/ * использовать настройки браузера для размера текста и шрифта * /html, тело, #globalWrapper { шрифт: наследовать !важный; }/ * всегда подчеркивать ссылки * /:связь { текст-украшение: подчеркивать; }/ * Отображение основного содержимого в более узком столбце для облегчения чтения * // * отрегулируйте проценты по желанию * /div#bodyContent {  ширина: 50%;  высота линии: 105%;}/ * меняем фон невыбранных вкладок * /#p-реакции ул Ли а { фон: # C7FDC7; }/ * изменить фон выбранных вкладок * /#p-реакции ул Ли.выбранный а { фон: белый; }/ * изменение фона границы выбранных вкладок * /#p-реакции Ли.выбранный { цвет границы: #aaaaaa; }/ * нижняя часть вкладки не удаляется при наведении * /#p-реакции Ли а:парить { z-индекс: 0; текст-украшение: никто; }#p-реакции Ли.выбранный а:парить { z-индекс: 3; }/ * стиль окна поиска и кнопок под ним * /.searchButton {    фоновый цвет: #efefef;    граница: 1px начало;}#searchInput { граница: 1px вставка; }/ * стандартные цвета ссылок * /а:связь { цвет: # 0645ad; }а:посетил { цвет: # 0b0080; }а.новый:связь { цвет: # cc2200; }а.новый:посетил { цвет: # a55858; }а.extiw:связь { цвет: # 3366bb; } / * ссылки на другие Википедии * /а.extiw:посетил { цвет: # 3366bb; }а.внешний:связь { цвет: # 3366bb; } /* внешняя ссылка */а.внешний:посетил { цвет: # 3366bb; }/ * помещаем полосу прокрутки в предварительные разделы вместо уродливой обрезки / перекрытия в Firefox * /предварительно { переполнение: авто; }/ * вычеркнута ссылка на файл «Загрузить файл» в качестве напоминания о загрузке в Commons * /Ли#t-upload { текст-украшение: Линия, проходящая через; }/ * центрировать / центрировать заголовок каждой страницы * /.firstHeading { выравнивание текста: центр; }/ * Предупреждение о двойном перенаправлении * /div.redirectMsg а.mw-перенаправление:после {  содержание: '& lt; двойное перенаправление & gt;';  цвет: красный;  стиль шрифта: курсив;}/ * Запретить новый CSS в «Обновление типографики» (с начала 2014 г.) отображать заголовки страниц и заголовки шрифтом с засечками * /h1, h2 { семейство шрифтов: наследовать !важный; }/ * Отображение полей персональных данных в статьях * /стол.персональные данные { отображать:стол; }/ * Избавляемся от утомительных предупреждений * /#editpage-copywarn, #editpage-copywarn2, #editpage-copywarn3,#editpage-head-copywarn, .editpage-head-copywarn,#editnotice_BLP_editintro, .ve-ui-mwSaveDialog-license{ отображать: никто !важный; }/ * Избавьтесь от утомительного шаблона новичков * /#категория-пространство имен-editnotice, #нижний колонтитул-информация-авторское право, #siteub, .править,.отправлено, #значки нижнего колонтитула, .ve-ui-mwSaveDialog-summaryLabel{ отображать: никто !важный; }/ * Экономия места в списке шаблонов, отображаемых в конце страницы при редактировании * /:шаблоны ул, :шаблоны Ли {отображать: в соответствии; отступ справа: 5px;}/ * Измените весь текст на шрифт «Avenir» (кроме заголовков) (вы можете изменить шрифт на любой другой) * /.mw-body h1, .mw-body h2 {    семейство шрифтов: «Авенир»}

Закругленные углы

Правила закругленных углов в Firefox
/ * скругляем несколько углов * /#p-реакции ул Ли, #p-реакции ул Ли а {  граница-верх-левый-радиус: 1Эм;  граница-верх-правый-радиус: 1Эм;}#содержание {  граница-верх-левый-радиус: 1Эм;  граница-нижний-левый-радиус: 1Эм;}.pBody {  граница-верх-правый-радиус: 1Эм;  граница-нижний-правый-радиус: 1Эм;}
Закругленные углы / ссылки на вкладки

Настройки режима печати

/*** Поместите все правила печати в блок печати @media.*// * экономим чернила и бумагу с очень мелким шрифтом * /@средства массовой информации Распечатать {    #нижний колонтитул,    #содержание,    тело { размер шрифта: 8pt !важный; }    h1 { размер шрифта: 17pt }    h2 { размер шрифта: 14pt }    h3 { размер шрифта: 11pt }    h4 { размер шрифта: 9pt }    h5 { размер шрифта: 8pt }    h6 {        размер шрифта: 8pt;        font-weight: нормальный;    }}/ * Дополнительные возможности: использование: до и: после можно добавить форматированиездесь добавляется полный href ссылки после него (не требуется в текущей версии): * /@средства массовой информации Распечатать {  #содержание а:связь:после,  #содержание а:посетил:после {     содержание: " ( " attr(href) " ) ";  }}

Сделайте панель инструментов пользователя сайдбоксом

Протестировано для работы в Camino, Safari и Internet Explorer 7.

/ * Преобразуем пользовательскую панель инструментов в сайдбокс * /#р-личный {    позиция:относительный;    z-индекс:3;    ширина: 11.6Эм;}#р-личный .pBody {    ширина: 10.7Эм;    граница: никто;    поле: 0 0 0.1Эм 0Эм;    плавать: никто;    переполнение: скрытый;    размер шрифта: 95%;    фон: белый;    граница-коллапс: крах;    граница: 1px твердый #aaaaaa;    набивка: 0 0.8Эм 0.3Эм .5Эм;}#р-личный ул {    высота линии: 1.5Эм;    список-стиль-тип: квадрат;    изображение в стиле списка: url("/style/monobook/bullet.gif");    размер шрифта:95%;    поле: 0 0 0 1.5Эм;    набивка:0;    выравнивание текста:оставили;    текстовое преобразование: никто;}#р-личный Ли {    отображать: Элемент списка;    набивка:0;    поле: 0 0 0 0;    край-низ: 0.1Эм;}/ * подавить значок человека вашим именем пользователя * // * необходимо, если еще не на месте * /Ли#pt-userpage { фон: никто }

Посмотреть монокнигу main.css для всех стилей, используемых по умолчанию.

Исправьте положение боковой панели при прокрутке

В скине Vector по умолчанию положение боковой панели можно легко исправить:

/ * Исправить боковую панель * /div#mw-панель { позиция: фиксированный;  переполнение: авто;  верх: 0px;  Нижний: 0px;  высота: 100%;  / * Предотвращение наложения контента при боковой прокрутке * /  фоновый цвет: # F6F6F6;  граница справа: 1px твердый # A7D7F9;}/ * Предотвращение боковой прокрутки в предварительных элементах * /предварительно {  переполнение: авто;  максимальная высота: 25Эм;}
Этот скрипт и CSS заставляют боковую панель оставаться в том же положении на экране при прокрутке.

Это может иметь нежелательные побочные эффекты в Chrome; например, при просмотре страницы, подобной странице очень common.css, которую вы только что отредактировали, чтобы вставить этот код, видимый контент станет намного короче и потребует вертикальной прокрутки во фрейме.

В Одеколон синий В скине есть опция для «плавающей левой» панели быстрого доступа, которая заставляет навигационные ссылки, панели инструментов и тому подобное оставаться на одном месте на экране во время прокрутки. Это обеспечивает ту же функциональность для Монокнига скин (в Mozilla). Видеть meta: Справка: Пользовательский стиль / плавающая панель быстрого доступа.

Меню монокниги со шрифтами с засечками в области содержимого

Быстрая и грязная комбинация меню Monobook со шрифтами с засечками в текстовой области находится на Пользователь: Tillwe / monobook.css (в первой части). Также более-менее корректно отображает табличные вещи. Есть некоторые причуды и ошибки (некоторые из-за того, что схема CSS Википедии не кажется слишком продуманной). Работает на Netscape7 / Win98 для автора.

Перемещение ссылок на категории

/******************************************************************// * перемещение ссылок вправо * //******************************************************************// * перемещаем поле ссылок * /#ссылки {  позиция:абсолютный;  z-индекс:1;  граница: 1px твердый #aaaaaa;  фон: #fafaff;  верно:1Эм;  верх:-0.25Эм;  ширина:10.5Эм;  плавать:верно;  поле: 0.2Эм;  набивка:0.2Эм;}/ * форматируем сами ссылки * /п.ссылки {  цвет: #aaaaaa;  семейство шрифтов: Вердана,без засечек;  размер шрифта:67%;  высота линии: 1.5Эм;  выравнивание текста:оставили;  отступ текста:0;  текстовое преобразование: никто;  белое пространство:нормальный;  поле: 0.2Эм;}#р-личный h5 {    отображать: в соответствии;}/ * форматирование ссылок в катлинках (в отличие от ":" и "|") * /п.ссылки а {  цвет:#888888;}

Стиль представления различий

/ * не используйте шрифт меньшего размера * /тд.diff-addedline, тд.diff-deletedline, тд.diff-context { размер шрифта: 100% };/ * подчеркиваем только другой текст * /охватывать.обмен { текст-украшение:подчеркивать; }

Удаление кнопки "(поблагодарить)" в журнале истории

/ * Подавить кнопки "(поблагодарить)" * /.мв-спасибо-спасибо-ссылка { отображать:никто; }

Скрытие длинных сообщений с инструкциями

/ * скрыть аннотацию View-Source при редактировании защищенной страницы * /#mw-protectedpagetext { отображать: никто; }

Как и в случае с другими стилями CSS выше, отредактируйте Специально: MyPage / skin.css или же Special: MyPage / common.css чтобы вставить настроенный CSS, а затем обновить кеш браузера.

Инфобоксы и пользовательский стиль

Пользователи могут иметь пользовательский CSS который скрывает любые информационные окна в собственных браузерах.

Чтобы скрыть все информационные окна, добавьте в Special: MyPage / common.css (для всех Оболочки, или же Специально: MyPage / skin.css только для текущего скина), в отдельной строке:

.информационное окно { отображать: никто; }

В качестве альтернативы вы можете добавить следующий код в ваш common.js или в пользовательский сценарий браузера, который выполняется расширением, например Грязная обезьяна:

$('.infobox').Спрятать();

Имейте в виду, что хотя WP: Руководство по стилю / инфобоксу, вся информация в информационном окне в идеале также должна быть найдена в основной части статьи, это не идеальное соблюдение этого правила. Например, полная таксономическая иерархия в {{Taxobox}}, а также коды OMIM и других медицинских баз данных {{Инфобокс болезнь}} часто не встречаются в основном содержании статьи. Информационное окно также часто является местом расположения наиболее значимого, даже единственного изображения в статье.

Пользовательский CSS для моноширинного шрифта кодирования

Вы можете последовательно использовать моноширинный шрифт с хорошо продуманными символами для кодирования (например, чтобы четко различать л, 1, и я, и между О и 0).

Добавьте что-то вроде одного из приведенных ниже фрагментов кода в свой Special: MyPage / common.css страница, заменяя «Робото Моно» любым шрифтом, который вы предпочитаете (Робото Моно был выбран в качестве свободно доступного шрифта для кодирования для этого примера).

Если вы не хотите вручную добавлять этот код на свою страницу CSS, а предпочитаете @импорт (включить) это, см. meta: Пользователь: SMcCandlish / codefont.css для быстрых инструкций.

Этот код будет делать следующее:

  • Примените согласованный моноширинный шрифт по вашему выбору (и резервную систему по умолчанию моноширинный, если этот шрифт отсутствует или в нем отсутствуют нужные символы) ко всем обычно моноширинным элементам HTML, например <code>, <pre>, так далее.
  • Сделайте то же самое для классов, используемых {{mxt}} и другие моноширинные шаблоны в {{xt}} семья
  • Сделайте то же самое для дополнительных классов на уровне сайта (как уже было определено, например, .monospaced), которые выводятся как моноширинные.
  • Сделайте так, чтобы три наиболее часто встречающихся поля редактирования также использовали этот стек шрифтов: главное окно редактирования, итоговая строка редактирования и поле ввода поиска.

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

Горизонтальный стиль

/ * Использовать мой шрифт, если он доступен, для кода * /код, предварительно, самп, kbd, тт, .пример-моно, .userlinks-имя пользователя, .моноширинный, .клавиша клавиатуры, .кнопка, .простой код { семейство шрифтов: «Робото Моно», моноширинный !важный; }/ * Делаем некоторые редактируемые материалы моноширинными * /#wpTextbox1, #wpSummary, #searchInput, #searchText { семейство шрифтов: «Робото Моно», моноширинный !важный; }

Вертикальный стиль

/ * Использовать мой шрифт, если он доступен, для кода * /код,предварительно,самп,kbd,тт,.пример-моно,.userlinks-имя пользователя,.моноширинный,.клавиша клавиатуры,.кнопка.простой код {  семейство шрифтов: «Робото Моно», моноширинный !важный;}/ * Делаем некоторые редактируемые материалы моноширинными * /#wpTextbox1,#wpSummary,#searchInput,#searchText {  семейство шрифтов: «Робото Моно», моноширинный !важный;}

Усилия по очистке

Если вы хотите помочь очистить экземпляры <тт>...</тт> element - который не является допустимым HTML с 1990-х годов, и его обычно следует заменять на <код>...</код> (это может варьироваться в зависимости от контекста) - вы можете добавить что-то вроде следующего в свой common.css сделать <тт> торчат как больной палец:

/ * Пометить плохой код для очистки * /тт { цвет: Темно-красный; фон: Розовый; }

Вы также можете сделать это с помощью <font>, <center>, <strike>, и другие устаревшие элементы. Для CSS вы можете просто импортировать для этого, см. meta: Пользователь: SMcCandlish / lint.css.

Внешние ссылки на CSS

JavaScript

У JavaScript есть много возможностей, например, добавление текста, включая ссылки, в желаемых местах. Это добавленное содержимое может зависеть от содержимого исходной HTML-страницы, созданного сервером; например, это может зависеть от элементов HTML с идентификатором, применяя getElementById. Позиция вставки может быть указана с помощью insertBefore.

Например, чтобы добавить ссылку на страницу слева от ваших предпочтений, добавьте следующее в Special: Mypage / common.js, заменив PageTitle заголовком вики-страницы:

mw.утилита.addPortletLink(	'p-personal', '/ wiki / PageTitle', 'Заголовок страницы', ноль, ноль, ноль, '# pt-предпочтения');

Перемещение категорий наверх

Следующий код перемещает поле категории в начало статьи. Конечно, вы можете применить CSS, чтобы он выглядел красивее:

функция кошка() {  вар кошки = документ.getElementById('ссылки');  вар до н.э = документ.getElementById(bodyContent);  до н.э.insertBefore(кошки, до н.э.childNodes[0]);}

Альтернатива, которая в сочетании с соответствующей таблицей стилей помещает текст примерно на той же строке, что и заголовок:

функция categoryToTop() {  вар тело = документ.getElementById('contentTop');  вар категории = документ.getElementById('ссылки');  если (категории != ноль) {    категории.parentNode.removeChild (категории);    тело.parentNode.insertBefore(категории, тело);  }}

Немного CSS для этого ...

/ * перемещаем поле ссылок * /#ссылки {  верно:1Эм;  верх:-0.25Эм;  Максимальная ширина: 50%; / * это ограничивает размер бокса, но не устанавливает строго * /  плавать: верно;  поле: 0.5Эм;  набивка: 0.2Эм;}/ * форматируем сами ссылки * /п.ссылки {  размер шрифта:67%;  выравнивание текста:оставили;  отступ текста:0;  текстовое преобразование: никто;  белое пространство:нормальный;  поле: 0.2Эм;}

К сожалению, если поле категории большое (например, в статьях о президентах США и других крупных фигурах), оно может отодвинуть информационное окно в сторону. Чтобы исправить это, в информационное окно можно добавить атрибут «clear: right».

CSS, управляемый Викитекстом

CSS можно контролировать через JS с помощью wikitext. Например, элемент HTML "span" без содержимого может через свой класс и идентификатор предоставлять параметры для JS, определяющие CSS для любых частей страницы. Например, если страница содержит элемент "span" с классом FA и идентификатором lc, MediaWiki: Monobook.js определяет стиль и заголовок элементов "li" класса interwiki-lc, таким образом управляя стилем и заголовком межъязыковой ссылки языкового кода lc на полях, при условии, что скин указывает этот класс interwiki-lc (Например, Cologne Blue указывает class = 'external' для каждого языка, поэтому он не работает для этого скина.)

Внешние ссылки на JS

Смотрите также