Это третья статья, в цикле изучения основ HTML и в ней я расскажу вам о некоторых тегах, который используются в теле документа.

Как я уже заметил в предыдещей статье "Основы HTML. Урок №2. Структура страницы." теги бывают парные и не парные, а так же там я дал определение тега, рассказал, что это вообще такое, в этой статье мы не будем на таком останавливаться.

Тег <p></p>

Этот тег один из наиболее распространенных. Тег абзаца, проще говоря в такой тег помещают текст, или большой текст, чтобы его было легче прочитать разделают на абзацы и каждый из них помещают в такой тег.

Код примера:

<p>На третий день после ссоры князь Степан Аркадьич Облонский - Стива, как его звали в свете, - в обычный час, то есть в восемь часов утра, проснулся не в спальне жены, а в своем кабинете, на сафьянном диване.. Он повернул свое полное, выхоленное тело на пружинах дивана, как бы желая опять заснуть надолго, с другой стороны крепко обнял подушку и прижался к ней щекой; но вдруг вскочил, сел на диван и открыл глаза.</p>
<p>"Да, да, как это было? - думал он, вспоминая сон. - Да, как это было? Да! Алабин давал обед в Дармштадте; нет, не в Дармштадте, а что-то американское. Да, но там Дармштадт был в Америке. Да, Алабин давал обед на стеклянных столах, да, - и столы пели: Il mio tesoro, и не Il mio tesoro, а что-то лучше, и какие-то маленькие графинчики, и они же женщины", - вспоминал он.</p>

Пример:

Тег <div></div>

По моему скромному мнению, самый часто используемый тег и самый полезный. Этот тег сообщает браузеру о блоке, в блоке может содержатся все, что угодно - картинки, текст, таблицы, видео. Используют его чаще всего для того, чтобы придать странице необходимую структуру. Если закинуть в него просто текст, никаких изменений не произойдет, но если использовать стили на этот блок, то текст будет преображаться, это уже ближе по теме к языку CSS.

Тег <img>

Данный тег сообщает браузеру о картинке на странице, задавая в этом теге адрес картинки, открывая его браузер будет показывать именно картинку.

Код примера:

<img src="http://l.foto.radikal.ru/0701/4bd6ed64fc81.jpg" />

Пример:

Тег <br/>

Тег вынужденного переноса строки или простоп переноса строки, используеться в разных случаях, если необходимо разделить текст или картинки или еще что-то.

Код примера:

<p>В этот момент происходит перенос строки на следующую строчку...<br>Продолжаем писать текст или что-то еще...</p>

Пример:

Тег <ul></ul> и <ol></ol> (а так же вспомогательный <li></li>)

Довольно часто при создании страничек используют списки, которые могут быть двух типов - нумерованные и маркерованные, так вот тег <ul> создает маркерованный список, а тег <ol> - нумерованный. Для того, чтобы добавить новый пункт в любой из таких списков нужно добавить теги <li></li>, которые по своей сути и представляют элемент списка.

Код примера:

<ul>
<li>Первый пункт</li>
<li>Второй пункт</li>
<li>Третий пункт</li>
</ul>
<ol>
<li>Первый пункт</li>
<li>Второй пункт</li>
<li>Третий пункт</li>
</ol>

Пример:

Теги модификации текста - <b></b>, <i></i>, <u></u>, <s></s>

Специальные теги, которые всячески модифицируют текст, например тег <b> - делает текст полужирным, тег <i> - курсивом, а тег <u> - подчеркивает текст, последний тег из представленных тут <s> - перечеркивает текст по середине.

Код примера:

<p>Обычный текст</p>
<p><b>Полужирный текст</b></p>
<p><i>Курсивный текст</i></p>
<p><u>Подчеркнутый текс</u></p>
<p><s>Перечеркнутый текст</s></p>

Пример:

Теги заголовков вида <hx></hx>

Такие теги модифицируют текст в зависимости от номера x = от 1 до 6, присвоенных тегу. При этом самым большим считаеться h1 и в порядке уменьшения размера идут следующие. Этот тег важен для поисковых систем, которые замечают первым делом большие заголовки и остальные не очень. Просмотрим пример, чтобы получше понять.

Код примера:

<h1>Заголовок</h1>
<h2>Заголовок</h2>
<h3>Заголовок</h3>
<h4>Заголовок</h4>
<h5>Заголовок</h5>
<h6>Заголовок</h6>

Пример:

Тег ссылки <a></a>

Последний тег, о котором мы расскажем - тег ссылки <a></a>, который сообщает браузеру что данный текст, находящийся в этом теге должен расцениватся как ссылка и при помощи атрибута href должен вести на определенную страницу.

Код примера:

<a href="http://web.cofp.ru/">Ссылка на наш сайт</a>

Пример:

Ну вот пожалуй и все основные теги, о которых вы должны знать обязательно, если вас заинтересовала данная тема, то более детальное описание каждого тега, а так же множество других тегов вы можете найти на сайт-справочнике.