Редактирование: различия между версиями
TeNoR (обсуждение | вклад) Нет описания правки |
TeNoR (обсуждение | вклад) Нет описания правки |
||
Строка 1: | Строка 1: | ||
__NOEDITSECTION____NOTOC__ |
|||
__NOTITLE____NOEDITSECTION____NOTOC__ |
|||
=== Работа с текстом: === |
=== Работа с текстом: === |
||
'''Текст с абзаца (параграфы):''' <span style="color:LimeGreen;"><nowiki><p>Текст с абзаца.</p><p>Еще один текст с абзаца.</p></nowiki></span> |
'''Текст с абзаца (параграфы):''' <span style="color:LimeGreen;"><nowiki><p>Текст с абзаца.</p><p>Еще один текст с абзаца.</p></nowiki></span> |
||
Строка 9: | Строка 9: | ||
---- |
---- |
||
=== Работа с разметкой: === |
=== Работа с разметкой: === |
||
'''Блоки <nowiki><div></nowiki>.''' Удобно использовать для оформления страницы, позволяет сохранять пропорции содержимого для разных расширений экрана. |
'''Блоки <span style="color:LimeGreen;"><nowiki><div /></nowiki></span>.''' Удобно использовать для оформления страницы, позволяет сохранять пропорции содержимого для разных расширений экрана. |
||
<br> |
<br> |
||
'''1. Создаем блок по содержимому:''' <span style="color:LimeGreen;"><nowiki><div style="background: rgba(0, 0, 0, 0.3);padding:10px;display:inline-block;">контент внутри определяет<br>размер блока</div></nowiki></span> |
'''1. Создаем блок по содержимому:''' <span style="color:LimeGreen;"><nowiki><div style="background: rgba(0, 0, 0, 0.3);padding:10px;display:inline-block;">контент внутри определяет<br>размер блока</div></nowiki></span> |
||
Строка 29: | Строка 29: | ||
<br> |
<br> |
||
<span style="color:LimeGreen;"><nowiki><br></nowiki></span> - стандартный перенос на новую строку, удобно использовать внутри текста. |
<span style="color:LimeGreen;"><nowiki><br></nowiki></span> - стандартный перенос на новую строку, удобно использовать внутри текста. |
||
<br> |
|||
<br> |
|||
'''4. Таблицы''' - самый удобный и надежный способ разметки. Так же хорошо комбинируются с блоками <span style="color:LimeGreen;"><nowiki><div /></nowiki></span>. Или просто для контента. |
|||
Способов применения таблиц слишком много, примеры оформления можно посмотреть на [https://www.mediawiki.org/wiki/Help:Tables] |
|||
{| class="wikitable sortable" style="float:left;text-align:center;margin-right:50px;" |
|||
|+ Пример таблицы с стандартным оформлением и сортировкой |
|||
|- |
|||
! заголовок 1 !! заголовок 2 !! заголовок 3 |
|||
|- |
|||
| A || 1 || Text1 |
|||
|- |
|||
| B || 2 || Text2 |
|||
|- |
|||
| C|| 3 || Text3 |
|||
|} |
|||
{| style="float:left;text-align:center;margin-right:50px;color:white; background:rgba(255,255,255,0.1);margin-top:5px;" cellpadding="20" |
|||
|- |
|||
|colspan="2" | Пример №2 |
|||
|- |
|||
| <sup>1</sup> || <big>2</big> |
|||
|- |
|||
|colspan="2" style="color:#00FFFF;" | '''TEXT''' |
|||
|} |
|||
{{NewLine}} |
|||
---- |
---- |
||
=== Спойлеры: === |
=== Спойлеры: === |
||
Строка 45: | Строка 69: | ||
В начале каждой страницы есть параметры (волшебные слова), рекомендуется использовать для каждой статьи (страницы): |
В начале каждой страницы есть параметры (волшебные слова), рекомендуется использовать для каждой статьи (страницы): |
||
<p><span style="color:LimeGreen;"><nowiki>__NOTITLE__</nowiki></span> Скрыть заголовок</p> |
<p><span style="color:LimeGreen;"><nowiki>__NOTITLE__</nowiki></span> Скрыть заголовок</p> |
||
<p><span style="color:LimeGreen;"><nowiki>__NOEDITSECTION__</nowiki></span> Cкрыть кнопку редактирования для заголовков</p> |
<p><span style="color:LimeGreen;"><nowiki>__NOEDITSECTION__</nowiki></span> Cкрыть кнопку редактирования для заголовков '''(рекомендовано)'''</p> |
||
<p><span style="color:LimeGreen;"><nowiki>__NOTOC__</nowiki></span> Cкрыть содержание страницы</p> |
<p><span style="color:LimeGreen;"><nowiki>__NOTOC__</nowiki></span> Cкрыть содержание страницы '''(рекомендовано)'''</p> |
||
<br> |
<br> |
||
В конце страницы указаны дополнительные параметры: |
В конце страницы указаны дополнительные параметры: |
Версия от 22:22, 12 декабря 2020
Работа с текстом:
Текст с абзаца (параграфы): <p>Текст с абзаца.</p><p>Еще один текст с абзаца.</p>
Текст с абзаца.
Еще один текст с абзаца.
Отступ только для первой строки текста: <p style="text-indent:10px;">Текст с абзаца.</p>
Текст с абзаца.
Использование стилей внутри текстового поля: Допустим нам нужно <span style="color:#FFFF00;">перекрасить текст внутри</span> текстового поля
Работа с разметкой:
Блоки <div />. Удобно использовать для оформления страницы, позволяет сохранять пропорции содержимого для разных расширений экрана.
1. Создаем блок по содержимому: <div style="background: rgba(0, 0, 0, 0.3);padding:10px;display:inline-block;">контент внутри определяет<br>размер блока</div>
размер блока
2. Разметка и выравнивание блоков: <div style="float:left;background: rgba(0, 0, 0, 0.3);display:inline-block;width:200px;height:100px;margin-left:20px;"></div>
float:left - указывает, что элементы могут облегать друг-друга, слева
width и height - размер, за который не может заходить контент, если не указать overflow-y:hidden; - контент будет вылазить за пределы
float:right; - указывает что элемент будет прилягать к правому краю страницы.
overflow:auto; - автоматическое заполнение оставшегося места, если контента больше чем блок - появится скроулинг
margin-left:20px; и margin-right:20px; указанные в блоке 4 и 2, определяют отступы от блоков, слева и справа.
Блок 3 должен записывать в самом конце, чтобы понимать до каких пределов ему можно растянуться (блок 1, 2 и 4 должны указать размер, который они займут)
Есть более сложные способы разметки, например, у блока указана ширина относительно оставшегося места на странице по окну браузера (параметр: position:relative ), для демонстрации попробуйте зажать Ctrl и покрутить колесико мыши.
3. Новые строки. Из-за свойств обтекания (float) может случится, что следующий элемент будет пытаться наследовать это обтекание. Для этого нужно задавать свойство clear:left;, что запрещает обтекание элементов и создает их с новой строки.
Для удобства у этой Вики есть шаблон, достаточно добавить:
{{NewLine}} - чтобы гарантировано получить новую строку.
<br> - стандартный перенос на новую строку, удобно использовать внутри текста.
4. Таблицы - самый удобный и надежный способ разметки. Так же хорошо комбинируются с блоками <div />. Или просто для контента.
Способов применения таблиц слишком много, примеры оформления можно посмотреть на [1]
заголовок 1 | заголовок 2 | заголовок 3 |
---|---|---|
A | 1 | Text1 |
B | 2 | Text2 |
C | 3 | Text3 |
Пример №2 | |
1 | 2 |
TEXT |
Спойлеры:
1. Вариант - использование шаблона: <p style="float:left">Показать спойлер:</p> {{Show|текст спойлера}}
Показать спойлер:
: текст спойлера
2. Вариант - использование плагина: {{#spoiler:|spoiler_text}}
{{#spoiler:show=Показать содержимое под кнопкой|hide=Скрыть|spoiler_text}}
Оформление страниц:
В начале каждой страницы есть параметры (волшебные слова), рекомендуется использовать для каждой статьи (страницы):
__NOTITLE__ Скрыть заголовок
__NOEDITSECTION__ Cкрыть кнопку редактирования для заголовков (рекомендовано)
__NOTOC__ Cкрыть содержание страницы (рекомендовано)
В конце страницы указаны дополнительные параметры:
<noinclude></noinclude> Теги для скрытия параметров
[[Category:Название_категория| ]] Добавляет раздел в категорию для навигации
[[en:Page_English_Name]] Указывает что у страницы есть английская версия статьи
[[ru:Название_Русской_Статьи]] Указывает что у страницы есть английская версия статьи