Интернет, компьютеры, софт и прочий Hi-Tech

Подписаться через RSS2Email.ru

Что такое теги разметки текста

Вы открываете документ и восхищаетесь его вёрсткой, оформлением, чёткой структурой. Картинки и прочие объекты расставлены по местам, текст форматирован и распределён удобно для восприятия, элементы расфасованы по тематическим блокам. Так вот, вёрстка возможна благодаря тегам (дескрипторам) разметки. Это служебные данные, невидимые для пользователя.

Рассмотрим язык HTML (HyperText Markup Language), поскольку принцип применения тегов в нём наиболее прост. Да и начинающим веб-мастерам пригодится.

Две новости

Одна новость — обнадёживающая, а другая... нет, плохой не является, просто лишает излишних иллюзий.

Что именно должно обнадёживать? Наличие HTML-редакторов, позволяющих осуществлять вёрстку веб-страниц в визуальном режиме («что вижу, то и получаю»).

Таким редактором может служить текстовый процессор из пакета офисных приложений, Microsoft Word или LibreOffice Writer. Просто нужно после нажатия «Файл» и «Сохранить как» выбрать в выпадающем списке «Тип файла» формат «Документ HTML» (либо «Веб-страница», суть та же).

Умная программа расставит не те дескрипторы, которые использует для других форматов, а именно теги HyperText Markup Language. И даже создаст папку, откуда будут подгружаться вставленные изображения.

Вторая новость, развеивающая иллюзии: теги языка разметки HTML всё равно нужно изучать, чтобы осуществлять редактирование оных вручную.

Теги разметки HTML

Для удобства разделим теги разметки на две группы: ответственные за графическое оформление текста и служащие для вёрстки всей страницы.

Графическое оформление текста

Суть данного понятия заключается в том, что текст разделяется на абзацы, не пишется сплошным потоком. А вдобавок ещё и форматируется (применяется разное начертание, разные раскраски и размер).

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

Пустую строку образовывает тег <P>. Его в HyperText Markup Language можно не закрывать, но тогда при копировании текста из браузера, в конце абзаца будет лишний пробел после точки. Поэтому лучше закрыть. Вот так: </p> (да, теги можно писать и маленькими буквами).

У тега могут быть атрибуты с какими-нибудь значениями. К примеру, выравнивание абзаца по ширине:

<p align="justify">

(Правда, подобное оформление чаще реализуется средствами CSS, каскадных листов стилей.)

Блоки текстовой информации также нередко разделяются горизонтальными линиями. Тег: <hr>. В HyperText Markup Language обязательного закрытия не требует.

Одинарный перевод каретки, простой переход к новой строке без всякой пустоты: тег <br>. Тут есть некоторые тонкости.

Во-первых, два тега <br> подряд по своему действию аналогичны одному <p>. Во-вторых, <br> принято «вкладывать» в <p>. Примерно так:

<p>Здесь начинается абзац, сразу после пустой строки выше.
<br>Переходим к новой строке, не вставляя пустую.
<br>И ещё раз переходим. Мало ли, может, стихотворную строфу оформляем.
<br>Всё, это уже в последний раз.
Далее следует тег, закрывающий весь этот абзац. Вот он: </p>

Маркированные и нумерованные списки — структура с дополнительными символами в начале каждой строки.

Конкретные символы в маркированном списке указываются в атрибуте type тега <ul>, а теги <li> действуют как <br>:

<ul type="circle">
 <li> Один пункт списка с колечком в начале строки</li>
 <li> Ещё один с таким же колечком</li> 
 <li> Ну и ещё один, наглядности ради</li> 
</ul>

Для создания нумерованного списка вместо <ul> применяем <ol>. Естественно, значения атрибута type будут другими (варианты: A, a, I, i, 1).

Форматирование

Некоторые дескрипторы, предназначенные для форматирования текста:

<i>Написанное курсивом.</i>
<b>Текст с полужирным начертанием.</b>
<strong>Выделенный текст, чаще всего тоже как полужирный.</strong>
<u>Подчёркнутый текст.</u>
<h1>Большой заголовок</h1>,
<h2>заголовок поскромнее</h2>...

И так далее.

Со временем некоторые теги форматирования текста меняются. В смысле, отменяются, изгоняются из стандартов, прекращают работать в свежих браузерах, вместо них принимаются новые. Так случилось, к примеру, с отвергнутым тегом <strike>, зачёркивающим текст. Поэтому учебник по HTML у вас должен быть не слишком старым.

Продолжение этой статьи: «Что такое теги разметки текста. Часть 2».

Автор: vanilinkin, специально для xBB.uz, 13.05.2012


Предыдущие публикации:

Биржа долевых инвестиций SIMEX.

Последнее редактирование: 2012-05-14 16:03:11

Метки материала: что такое, что, текст, теги, что такое теги, такое, текста, разметка, разметки, разметка текста, теги разметки, теги разметки текста, что такое гипертекст, информационные технологии, ит, it, тег, гипертекст, цифровые технологии, язык разметки html, html

Оставьте, пожалуйста, свой комментарий к публикации

Представиться как     Антибот:
   

Просьба не постить мусор. Если вы хотите потестить xBB, воспользуйтесь кнопкой предварительного просмотра на панели инструментов xBBEditor-а.


© 2007-2017, Дмитрий Скоробогатов.
Разрешается воспроизводить, распространять и/или изменять материалы сайта
в соответствии с условиями GNU Free Documentation License,
версии 1.2 или любой более поздней версии, опубликованной FSF,
если только иное не указано в самих материалах.