Тег | HTML справочник
Поддержка браузерами
Описание
Обычно любой документ содержит какой-либо текст, будь то описание к изображению или описание чего-либо другого, для удобства восприятия текста, он делится на небольшие части (подразделы), разделенные переносом строки, пустой строкой или отступом. Эти подразделы текста и называются абзацами.
Для определения абзаца в HTML-документе используется тег <p> (p — сокращение от англ. слова paragraph — абзац). При отображении тега <p>, браузер автоматически вставляет до и после него отступы, отделяя его, таким образом, от других элементов, размер отступов можно изменить с помощью стилей CSS. Для разрыва строки внутри абзаца используется тег <br>.
HTML тег <p>, вместе со всем его содержимым, относится к блочным элементам, при отображении он будет занимать всю доступную ему ширину, а высота будет зависеть от содержимого.
Примечание: cтоит обратить внимание на то, что все пробелы поставленные между открывающим тегом <p> и его содержимым будут игнорироваться браузером, также как и все пробелы между содержимым и закрывающим тегом </p>. Поэтому, такую банальную вещь, как красная строка, не получится сделать лишь поставив несколько дополнительных пробелов перед текстом, но с этой проблемой легко будет справиться с помощью CSS свойства text-indent, которое позволяет не только задать красную строку, но и точно определить размер отступа для нее.
Атрибуты
Тег <p> поддерживает Глобальные атрибуты и События
Стиль по умолчанию
p { display: block; margin-top: 1em; margin-bottom: 1em; margin-left: 0; margin-right: 0; }
Пример
<p>Этот текст находится в абзаце.</p> <p>Это второй абзац на странице.</p> <p>А это третий абзац.</p>
Результат данного примера в окне браузера:
puzzleweb.ru
| Справочник HTML
Элемент <p> (от англ. «paragraph» ‒ «параграф, абзац») определяет текстовый абзац или параграф. Тег <p>, вместе со всем его содержимым, относится к блочным элементам, при отображении он будет занимать всю доступную ему ширину, а высота будет зависеть от содержимого. Если закрывающего тега нет, считается, что конец абзаца совпадает с началом следующего абзаца или другого блочного элемента.
Примечание: Чтобы увеличить или уменьшить расстояние между абзацами используйте CSS свойство margin (внешние отступы элемента), не используйте для этих целей HTML тег <br>, который предназначен для перевода строки внутри абзаца.
Синтаксис
<p>Текст</p>
Закрывающий тег
Не обязателен.
Атрибуты
- alignУстарел в HTML5
- Определяет выравнивание текста в абзаце. Используйте CSS вместо данного атрибута.
Для этого элемента доступны глобальные атрибуты и события.
Стилизация по умолчанию
Большинство браузеров отобразит элемент <body> со следующими значениями CSS по умолчанию:
p {
display: block;
margin-top: 1em;
margin-bottom: 1em;
margin-left: 0;
margin-right: 0;
}
Различия между HTML 4.01 и HTML5
Атрибут align не поддерживается в HTML5.
Пример использования:
Абзацы маркируется следующим образом:
Пример HTML:
Попробуй сам<p>Это параграф.</p>
<p>Это тоже параграф.</p>
<p>И это тоже параграф.</p>
Спецификации
Поддержка браузерами
Элемент | ||||||
<p> | 1+ | 1+ | 1+ | 1+ | 1+ | 1+ |
Элемент | ||||
<p> | 1+ | 1+ | 6+ | 1+ |
Попробуйте сами — Примеры
Перевод строк
Как форматировать текст внутри абзаца:
Форматирование текста
Учебник HTML
HTML уроки: HTML Элементы
HTML Форматирование
wm-school.ru
seodon.ru | Теги HTML — Тег P
Опубликовано: 25.06.2010 Последняя правка: 10.12.2015
Тег <P> применяется для разделения страницы на параграфы. Он может содержать только текст и inline-теги (теги уровня строки). При этом сам тег <P> является блочным, то есть создает перенос строки перед собой и после себя. Кроме этого, он устанавливает поля (margin) свободного пространства сверху и снизу от своих сторон до окружающего контекста, благодаря чему и происходит визуальное разбиение страницы на параграфы. Размер полей тега <P> зависит от типа браузера, но примерно он равен высоте одной строки текста на текущей странице.
Закрывающий тег </P> не является обязательным. Если он отсутствует, то концом параграфа будет считаться первый не-inline-тег расположенный ниже в HTML-коде страницы.
Атрибуты
Личные атрибуты:
- align — Устанавливает горизонтальное выравнивание содержимого параграфа.
Общие атрибуты:
- accesskey — устанавливает клавишу быстрого доступа для фокусировки на HTML-элементе.
- class — задает имя класса или классов тега, используемых в CSS (Каскадные таблицы стилей).
- dir — указывает направление текста внутри элемента.
- id — задает имя идентификатора HTML-тега, который может использоваться в качестве «якоря» или в таблицах стилей.
- lang — указывает язык, на котором написан текст внутри HTML-элемента.
- style — необходим для применения встроенных стилей CSS к тегу.
- tabindex — устанавливает порядок табуляции между элементами (клавиша Tab).
- title — выводит всплывающую подсказку при наведении курсора мыши на HTML-элемент.
Тип тега
Назначение: текст (блоки).
Модель тега: block (блочный, уровня блока).
Может содержать: inline-теги, обычный текст и спецсимволы HTML (мнемоники).
Открывающий тег: необходим. Закрывающий тег: не обязателен.
Синтаксис
<p>содержимое</p>
Пример HTML: применение тега P
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd"> <html> <head> <meta http-equiv="Content-Type" content="text/html; charset=utf-8"> <title>seodon.ru - Применение тега P</title> </head> <body> <p>Одной из ошибок начинающих создателей сайтов является использование неоднородных изображений или ярких цветов для фона текстовой информации на странице. Это не только затрудняет чтение, но и пагубно влияет на зрение пользователей, заставляя их всматриваться в каждую строчку и излишне напрягать глаза.</p> <p>Еще одна ошибка — это использование «где ни попадя» инвертированных цветов, когда визуально цвет текста светлее фона, например черный фон — белый текст. Данная техника вполне применима, но только там, где это действительно к месту.</p> </body> </html>
Результат примера
Поддержка версиями HTML
Версия: | HTML 4.01 | HTML 5 | XHTML 1.0 | XHTML 1.1 |
Поддержка: | Да | Да | Да | Да |
Поддержка браузерами
Браузер: | Internet Explorer | Google Chrome | Mozilla Firefox | Opera | Safari |
Версия: | 6.0 и выше | 2.0 и выше | 2.0 и выше | 9.2 и выше | 3.1 и выше |
Поддержка: | Да | Да | Да | Да | Да |
spravka.seodon.ru
| HTML | WebReference
Определяет текстовый абзац. Элемент <p> (от англ. paragraph — абзац, параграф) является блочным, всегда начинается с новой строки, абзацы текста идущие друг за другом разделяются между собой отбивкой
Закрывающий тег
Не обязателен.
Пример
<!DOCTYPE HTML> <html> <head> <meta charset="utf-8"> <title>P</title> </head> <body> <p>Рекомендуется совершить прогулку на лодке по каналам города и Озеру Любви.</p> <p>Венгры страстно любят танцевать, особенно ценятся национальные танцы.</p> <p>Из первых блюд распространены супы-пюре и бульоны, но подают их редко.</p> </body> </html>
Результат данного примера показан на рис. 1.
Рис. 1. Абзацы текста
Спецификация ?
Спецификация
Каждая спецификация проходит несколько стадий одобрения.
- Recommendation (Рекомендация) — спецификация одобрена W3C и рекомендована как стандарт.
- Candidate Recommendation (Возможная рекомендация) — группа, отвечающая за стандарт, удовлетворена, как он соответствует своим целям, но требуется помощь сообщества разработчиков по реализации стандарта.
- Proposed Recommendation (Предлагаемая рекомендация) — на этом этапе документ представлен на рассмотрение Консультативного совета W3C для окончательного утверждения.
- Working Draft (Рабочий проект) — более зрелая версия черновика после обсуждения и внесения поправок для рассмотрения сообществом.
- Editor’s draft (Редакторский черновик) — черновая версия стандарта после внесения правок редакторами проекта.
- Draft (Черновик спецификации) — первая черновая версия стандарта.
Особняком стоит живой стандарт HTML (Living) — он не придерживается традиционной нумерации версий, поскольку находится в постоянной разработке и обновляется регулярно.
×Браузеры
В таблице браузеров применяются следующие обозначения.
- — элемент полностью поддерживается браузером;
- — элемент браузером не воспринимается и игнорируется;
- — при работе возможно появление различных ошибок, либо элемент поддерживается с оговорками.
Число указывает версию браузреа, начиная с которой элемент поддерживается.
×Автор и редакторы
Автор: Влад Мержевич
Последнее изменение: 09.10.2018
Редакторы: Влад Мержевич
webref.ru
Тег | htmlbook.ru
Internet Explorer | Chrome | Opera | Safari | Firefox | Android | iOS |
3.0+ | 1.0+ | 1.0+ | 1.0+ | 1.0+ | 1.0+ | 1.0+ |
Спецификация
HTML: | 3.2 | 4.01 | 5.0 | XHTML: | 1.0 | 1.1 |
Описание
Тег <tr> служит контейнером для создания строки таблицы. Каждая ячейка в пределах такой строки может задаваться с помощью тега <th> или <td>.
Синтаксис
<table>
<tr>
<td>...</td>
</tr>
</table>
Атрибуты
- align
- Определяет выравнивание содержимого ячеек по горизонтали.
- bgcolor
- Цвет фона ячеек.
- bordercolor
- Цвет рамки.
- char
- Выравнивание содержимого ячеек относительно заданного символа.
- charoff
- Смещение содержимого ячеек относительно указанного символа.
- valign
- Выравнивание содержимого ячеек по вертикали.
Также для этого тега доступны универсальные атрибуты и события.
Закрывающий тег
Не обязателен.
Пример
HTML 4.01IECrOpSaFx
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN"
"http://www.w3.org/TR/html4/strict.dtd">
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8">
<title>Тег TR</title>
</head>
<body>
<table border="0" cellpadding="4">
<tr align="right" valign="top">
<td><img src="images/book.png" alt="Книга"></td>
<td>Lorem ipsum dolor sit amet...</td>
</tr>
</table>
</body>
</html>
Статьи по теме
Не выкладывайте свой код напрямую в комментариях, он отображается некорректно. Воспользуйтесь сервисом cssdeck.com или jsfiddle.net, сохраните код и в комментариях дайте на него ссылку. Так и результат сразу увидят.
htmlbook.ru
Тег | htmlbook.ru
Internet Explorer | Chrome | Opera | Safari | Firefox | Android | iOS |
3.0+ | 1.0+ | 1.0+ | 1.0+ | 1.0+ | 1.0+ | 1.0+ |
Спецификация
HTML: | 3.2 | 4.01 | 5.0 | XHTML: | 1.0 | 1.1 |
Описание
Устанавливает жирное начертание шрифта. Допустимо использовать этот тег совместно с другими тегами, которые определяют начертание текста.
Синтаксис
<b>Текст</b>
Закрывающий тег
Обязателен.
Атрибуты
Для этого тега доступны универсальные атрибуты и события.
Аналог CSS
font-weight
Пример. Использование тега <b>
HTML5IECrOpSaFx
<!DOCTYPE HTML>
<html>
<head>
<meta charset="utf-8">
<title>Тег B</title>
</head>
<body>
<p><b>Lorem ipsum dolor sit amet</b></p>
<p><b>Lorem ipsum</b> dolor sit amet, consectetuer adipiscing elit,
sed diem nonummy nibh euismod tincidunt ut lacreet dolore magna aliguam erat
volutpat. <b>Ut wisis</b> enim ad minim veniam, quis nostrud exerci
tution ullamcorper suscipit lobortis nisl ut aliquip ex ea commodo consequat.</p>
</body>
</html>
Результат данного примера показан на рис. 1.
Рис. 1. Вид жирного начертания шрифта в тексте
Примечание
Хотя использование тега <b> не осуждается в HTML, применение стилей предоставляет больше возможностей по управлению жирностью текста. С другой стороны, поисковые системы «любят» слова, выделенные жирным начертанием, и повышают их рейтинг.
htmlbook.ru
Тег | htmlbook.ru
Internet Explorer | Chrome | Opera | Safari | Firefox | Android | iOS |
1.0+ | 1.0+ | 1.0+ | 1.0+ | 1.0+ | 1.0+ | 1.0+ |
Спецификация
HTML: | 3.2 | 4.01 | 5.0 | XHTML: | 1.0 | 1.1 |
Описание
Устанавливает курсивное начертание шрифта. Допустимо использовать этот тег совместно с другими тегами, которые определяют начертание текста.
Синтаксис
<i>Текст</i>
Закрывающий тег
Обязателен.
Атрибуты
Для этого тега доступны универсальные атрибуты и события.
Аналог CSS
font-style
Пример
HTML 4.01IECrOpSaFx
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN"
"http://www.w3.org/TR/html4/strict.dtd">
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8">
<title>Тег I</title>
</head>
<body>
<p><b><i>Lorem ipsum dolor sit amet</i></b></p>
<p><i>Lorem</i> ipsum dolor sit amet, consectetuer adipiscing elit,
sed diem nonummy nibh euismod tincidunt ut lacreet dolore magna aliguam erat
volutpat. <i>Ut</i> wisis enim ad minim veniam, quis nostrud exerci
tution ullamcorper suscipit lobortis nisl ut aliquip ex ea commodo consequat.</p>
</body>
</html>
Результат данного примера продемонстрирован на рис. 1.
Рис. 1. Вид курсивного текста
Примечание
Хотя использование тега <i> не осуждается в HTML, применение стилей предоставляет больше возможностей по управлению начертанием текста.
htmlbook.ru