Параграфы и выравнивание текста в HTML
В прошлом уроке мы учились создавать HTML заголовки, сегодня мы продолжаем изучать html и рассмотрим, как устанавливать html параграфы и производить выравнивание текста в HTML.
Параграфы или абзацы устанавливаются в html с помощью тэга <p> и парного закрывающего его </p>. Текст помещенный между двумя этими тегами и будет являться параграфам.
При этом между параграфами устанавливается небольшой отступ, который называется отбивкой. Ниже приведен пример кода с двумя параграфами, вставьте его в текстовый документ Блокнот, после чего пройдите в пункт меню «Файл» >> «Сохранить как…», и сохраните этот файл с расширением .html
<html> <head> <title>Моя первая страница </title> </head> <body> Вот вы и создали свою первую web страницу!!! <p> Параграф №1. Это пятый урок посвященный html. В нем мы рассмотрим как создаются html параграфы и что самое важное как в html осуществлять выравнивание текста с помощью параграфов.</p> <p> Параграф №2. Как делать форматирование текста - менять размер шрифта,делать текст курсивом, жирным, подчеркнутым, менять гарнитуру и т. д. читайте в остальных уроках на WEBMASTERMIX.RU </p> </body> </html>
Затем откройте эту страницу при помощи вашего браузера и вы увидите текст, разбитый на два абзаца.
Далее мы рассмотрим, как при помощи тэга <p> производить выравнивание текста в html.
Тэг <p> имеет атрибут align с помощью которого можно выравнивать текст необходимым нам образом. Этот атрибут имеет следующие параметры:
align=»left» будет сделано выравнивание текста по левому краю;
С левой стороны текст выравнивается по умолчанию, однако в некоторых случаях данный параметр может пригодиться.
align=»right» будет сделано выравнивание текста по правому краю;
align=»center» будет сделано выравнивание текста по центру;
align=»justify» данный параметр выравнивает текст по обоим краям, в результате все строчки становятся выровненными, как и на этом сайте.
Теперь добавим этот атрибут с различными параметрами к нашим двум абзацам, которые мы создали выше. Для этого в открывающий тэг параграфа <p> необходимо добавить атрибут align= с необходимым значением.
Это будет выглядеть так:
<p align="center">Параграф №1...... </p> <p align="right">Параграф №2...... </p>
В данном случае один абзац будет выровнен по центру, а второй сдвинут в право. Попробуйте поставить в параграфы другие значения, например к первому justify, а ко второму left, затем сохраните текстовый документ и обновите страницу в вашем браузере.
Первый абзац будет выровнен с двух сторон, а второй прижат к левому краю. Существует также тег альтернативный <p align=»center»>, это тег <center> и парный закрывающий его </center>. Попробуйте вставить эти теги на вашу страницу, а между ними разместите какой либо текст и он будет отображаться по центру. В следующем уроке мы рассмотрим как задавать цвет фона HTML документа, а также как изменять цвет текста в html документе
Материал подготовлен порталом: webmastermix.
ru
Рекомендуем ознакомиться:
- Подробности
Обновлено: 04 Сентябрь 2013
Создано: 12 Январь 2010
Просмотров: 27547
Тег в HTML | Scaler Topics
Тег
Тег
Обзор
Первоначально тег
Синтаксис
Атрибуты
Тег
Его можно использовать со всеми общими атрибутами для любого элемента HTML ( глобальных атрибутов ).Для чего используется тег
Тег
Тег
Выравнивание текста: по центру; Свойство — это встроенный элемент, который можно применять как к тегам
. Лучший вариант использования — применить его к определенной части строки на странице .
Различия между HTML-тегом
Из продолжающегося обсуждения видно, что первое отличие связано с устаревшим тегом
, поэтому он больше не используется в HTML5. 
Но выравнивание текста: по центру; Свойство будет поддерживаться в следующих версиях HTML и CSS.Начнем с того, что тег center в HTML является элементом уровня блока, что означает, что его можно применять как к элементу уровня блока, так и к встроенному элементу. Напротив, text-align: center; Свойство является встроенным элементом, поэтому оно работает как с отдельным элементом
, так и с элементом. Все его содержимое будет центрировано, но его размеры останутся неизменными, т. е. не изменятся.
Тег center в HTML размещает весь раздел горизонтально в центре. Но если вы хотите центрировать линию или часть строки по центру, text-align: center; будут необходимы.
Тег HTML CSS «выравнивание текста: по центру;» Свойство Элемент уровня блока Встроенный элемент Тег больше не поддерживается в HTML5. Выравнивание текста: по центру; Свойство поддерживается в HTML5 и будет по-прежнему в следующих версиях. Лучше использовать тег , так как он может расположить весь раздел в центре. Лучше использовать text-align: center; свойство, так как оно может выравнивать по центру определенную часть строки. Примеры
Пример 1. Иллюстрация тега центра HTML
Тег центра в HTML будет использоваться во всем разделе страницы. Мы рассмотрим пример, в котором теги
и
будут помещены внутри тега
. Вывод:
Как видно из выходных данных, тег
состоит из тега и двух тегов
. Таким образом, в принципе, это может работать со всем разделом, а не с одной строкой.
Пример 2: Иллюстрация свойства CSS для выравнивания текста по центру
Вот пример, показывающий, как мы можем использовать CSS text-align: center; для выравнивания текста по центру, но это свойство отдельно применяется к встроенным элементам, таким как теги
и теги
.
Вывод:
В приведенном выше примере кода мы видим, что в выходных данных элемент div расположен в центре, потому что мы использовали margin: auto; для этого. Но это не относится к тегам
и тегам
внутри него.
Мы будем использовать text-align: center; расположить их в центре. Итак, мы будем использовать следующее свойство, внеся изменения в тег
Но выравнивание текста: по центру; Свойство будет поддерживаться в следующих версиях HTML и CSS.
