Шаблон:Center/doc

Материал из Народные Сказки
Версия от 19:30, 19 мая 2023; ru>Andras
(разн.) ← Предыдущая версия | Текущая версия (разн.) | Следующая версия → (разн.)

Простые шаблоны без параметров {{Center|...}}, {{Left|...}}, {{Right|...}} служат для центрирования как изображения, так и текста, которые выступают в качестве параметра. Существуют два основных вида центрирования :

  1. Наиболее общий и, поэтому, самый простой вид центрирования — это центрирование текста внутри ячейки таблицы <td></td>, в блоке <div></div>, в абзаце <p></p> или в заголовках типа <h1></h1>. Для выравнивания (англ. Align) текста в CSS имеется определённое свойство text-align с параметрами: left , center , right и justify , которое реализовано в шаблоне {{Text-align}}. Если в блоке отсутствует изображение, то текст можно отцентрировать с помощью шаблона {{Center}}, иначе возникает неопределённая ситуация.
  2. Вторая, более сложная, ситуация возникает, когда рядом с текстом присутствует изображение. При изменении масштаба шрифта или размера экрана, свободное плавающее (англ. Float) пространство окна позволяет тексту плыть рядом с изображением, гибко перераспределяться, обтекая его либо слева, либо справа (понятно, что если изображение находится в центре, то текст можно разместить только снизу). Для реализации этой ситуации разработан шаблон {{Align}}.


Разметка Результат
{{Center|Hello world!}} 
Hello world!

Чтобы сделать это без шаблона, просто используйте следующий код:

<div class="center" style="width:auto; margin-left:auto; margin-right:auto;"></div>


Выравнивание текста в таблице

С помощью left, center, right
{{left|Left}} {{center|Center}} {{right|Right}}
Шаблон:Left
Center
Шаблон:Right
С помощью align
{{align|left|Left}} {{align|center|Center}} {{align|right|Right}}
Шаблон:Align Шаблон:Align Шаблон:Align


Выравнивание текста с помощью {{Text-align}}

Шаблон {{Text-align}} предназначен для работы с текстом и управляет горизонтальным выравниванием текста в пределах блока. В отличие от {{Align}}, умеет выравнивать абзац по ширине блока.

Формат: Шаблон:Tlx

Параметр позиция может принимать значения:

  • left    — строка выравнивается по левому краю.
  • center  — строка выравнивается по центру.
  • right   — строка выравнивается по правому краю.
  • justify — строка выравнивается по ширине блока, если её ширина больше ширины блока.
  • start — аналогично значению left, если текст идёт слева направо, и right, когда текст идёт справа налево.
  • end — аналогично значению right, если текст идёт слева направо, и left, когда текст идёт справа налево.
  • match-parent — это значение ведёт себя так же, как inherit, с различием, что значение start и end вычисляются в соответствии с direction и заменяются соответствующим значением left или right.
{{Text-align|left|'''Hello world!'''}}

Шаблон:Text-align

{{Text-align|right|'''Hello world!'''}}

Шаблон:Text-align

{{Text-align|center|'''Hello world!'''}}

Шаблон:Text-align

См. также