Седьмой этаж - Заголовки HTML – мал, мало, меньше…

На седьмом этаже мы узнаем с вами, какой тэг – всему голова в хтмл, а также раскроем еще один секрет тэга <font></font>.

Во главе, проще говоря, в заголовке, html документа может быть текст, прописанный тэгами одного из шести уровней. В визуальном воспроизведении все вышенаписанное выглядит так:


<H1> текст </H1>

<H2> текст </H2>

<H3> текст </H3>

<H4> текст </H4>

<H5> текст </H5>

<H6> текст </H6>

Самый важный заголовок мы вписываем в тэги h1, наименее важный – выделяем h6. Заголовки помогают структурировать текст документа, выделить наиболее важные моменты, которые вы хотели бы подчеркнуть.
А теперь отработаем на практике полученную информацию:

<html>
<head>
<title>Первый этаж</title>
</head>
<body text="#336699" bgcolor="#000000">
<div align="center">
<H3> Радуйтесь, я создал(а)свой первый шедевр!</H3>
<br>
<font color="#CC0000"> Поздравьте меня!!!</font> :) </div>
<p align="justify">
Вот я почти уже умею верстать в хтмл. Это очень увлекательное занятие. Всем рекомендую. Правда, правда, не пожалеете!
</p> 
</body>
</html> (посмотреть)

Как видно в браузере, заголовки не только крупнее остального текста, но и выделены полужирным шрифтом. Кроме того, после закрытия «заголовочного» тэга, текст автоматически переносится на следующую строку.

Тэги h, предназначены для укрупнения небольшого количества текста. Но если вам все таки хочется подчеркнуть важность целого абзаца или даже двух – в html используют знакомый нам уже тэг <font></font>, присваивая ему атрибут со значением size.

<font size="+4"> текст </font>

<font size="+3"> текст </font>

<font size="+2"> текст </font>

<font size="+1"> текст </font>
<font size="+0"> текст </font>
<font size="-1"> текст </font>
<font size="-2"> текст </font> 

А теперь закрепим пройденный материал на практике:

<html>
<head>
<title> Первый этаж </title>
</head>
<body text="#336699" bgcolor="#000000">
<div align="center">
<H3> Радуйтесь, я создал(а)свой первый шедевр!</H3>
<br>
<font color="#CC0000"> Поздравьте меня!!!</font> :) </div>
<p align="justify">
Вот я почти уже умею верстать в хтмл. Это очень увлекательное занятие. Всем рекомендую. <font size="+1"> Правда, правда, не пожалеете!</font>
</p> 
</body>
</html> (посмотреть)

И перед тем, как продолжить наше восхождения к вершинам html, предупредим вас о том, что размер – имеет значение, и переусердствовать с ним не стоит, так как ваш шедевр может попахивать разнокалиберной безвкусицей…

А ведь мы с вами – эстеты в области хтмл;). Осознали? Тогда поднимаемся выше!