- •Html Введение
- •Создание html документов
- •Html заголовки
- •Html элементы
- •5.Html атрибуты
- •6.О важности заголовков
- •Пример 61
- •Пример 62
- •Пример 63
- •Пример 64
- •Пример 65
- •7.Разделение на абзацы
- •Пример 71
- •Пример 72
- •Пример 73
- •Пример 74
- •Пример 75
- •Пример 76
- •8.Оформление html документов с помощью css
- •Пример 81
- •9.Html гиперссылки
- •Пример 91
- •Пример 92
- •Пример 93
- •Пример 94
- •10.Добавление изображений в html документы
- •Пример 101
- •Пример 102
- •Пример 103
- •11.Таблицы
- •Пример 111
- •Пример 112
- •Пример 113
- •Пример 114
- •12. Списки
- •Пример 121
- •Пример 122
- •Пример 123
- •Пример 124
- •13. Html формы
- •Пример 131
- •Пример 132
- •Пример 133
- •Пример 134
- •Пример 135
- •Пример 136
- •Пример 137
- •Пример 138
- •Пример 139
- •Пример 1310
- •Пример 141
- •Пример 142
- •Пример 143
- •Пример 144
- •Пример 145
- •Пример 146
- •16. Секция head
- •17. Элемент script
- •18. Спецсимволы html
- •19.Что дальше?
Html заголовки
Данная глава только знакомит Вас с основными возможностями HTML, позднее мы рассмотрим каждый из этих тэгов подробнее.
Заголовки в HTML определяются тегами <h1>-<h6> (h1 определяет самый крупный заголовок, а h6 самый мелкий).
Пример 31
<html>
<body>
<h1>Это заголовок</h1>
<h2>Это заголовок</h2>
<h3>Это заголовок</h3>
<h6>Это заголовок</h6>
</body>
</html>
HTML абзацы
С помощью HTML тега <p> Вы можете определить абзац.
Абзацы используются для логической группировки текста. Перед и после текста абзаца браузер автоматически отступает одну строку.
Пример 32
<html>
<body>
<p>Это абзац</p>
<p>Это другой абзац</p>
</body>
</html>
HTML ссылки
С помощью HTML тэга <a> Вы можете определить ссылку.
Ссылки используются для связывания HTML документов друг с другом. Нажав на ссылку пользователь будет перемещен на другой HTML документ, url которого указан в атрибуте href.
Пример 33
<html>
<body>
<a href="http://www.yahoo.com">yahoo.com</a>
</body>
</html>
Обратите внимание: атрибуты будут подробно рассмотрены далее.
Вставка изображений
С помощью HTML тега <img> Вы можете вставить в HTML документ произвольное изображение.
Ширина и высота картинки может задаваться с помощью атрибутов width и height.
Пример 34
<html>
<body>
<img src='silvercoastregion1.jpg'width='700'height='242'/>
</body>
</html>
Html элементы
HTML элементом называется комбинация начального тэга, конечного тэга и содержимого.
Примеры HTML элементов:
Начальный тэг |
Содержимое элемента |
Конечный тэг |
<p> |
Это абзац. |
</p> |
<b> |
Это жирный текст. |
</b> |
<br /> |
||
Обратите внимание: большинство элементов могут также иметь атрибуты (атрибуты будут подробно рассмотрены далее).
О конечном тэге
Браузер верно отобразит HTML элемент, даже если Вы забудете указать конечный тэг.
HTML является языком, "прощающим ошибки", однако существует и более строгая разновидности языка (XHTML), в которой пропуск конечного тэга будет считаться ошибкой.
Пример 41
<p>Параграф без закрытого тэга
<p>Еще один параграф без закрытого тэга
Вложенные элементы
Большинство элементов могут быть вложены в друг друга (т.е. в содержимом одного элемента может располагаться другой элемент).
Например вложив элемент <i> в элемент <b> Вы сможете сделать текст одновременно жирным и курсивным.
В XHTML элементы всегда должны быть вложены правильно (неправильно: <i><b></i></b>, правильно: <i><b></b></i>), в HTML неправильно вложенные элементы не считаются ошибкой.
Пример 42
<i><b>Данный текст курсивный и жирный одновременно.</b></i>
Пустые HTML элементы
Элементы, которые не имеют содержимого, называются пустыми элементами.
В XHTML пустые элементы обязаны иметь закрывающийся тэг (<br />,<hr />), в HTML отсутствие закрывающегося тэга не считается ошибкой и браузер будет верно отображать такие элементы.
В каком регистре писать тэги?
HTML не чувствителен к регистру это значит, что тэг <b> будет интерпретироваться браузером так же как и тэг <B>, в XHTML тэги могут быть написаны только в нижней раскладке.
Несмотря на то, что HTML не настаивает на строгом синтаксисе, мы рекомендуем заранее выработать определенные правила написания кода (например, если Вы решили не использовать закрывающиеся тэги, не используйте их никогда).
Код, не следующий никаким правилам, неприятно читать и сложно понимать.
Сравните 43:
<!-- 1. Код, написанный в "свободном стиле" -->
<HR>
<P ID=par1>Это первый параграф
<br />
<i><p>Это второй параграф</I>
<HR>
<!-- 2. Код, следующий правилам XHTML -->
<hr />
<p id="par1">Это первый параграф</p>
<br />
<i><p>Это второй параграф</p></i>
<hr />
Обратите внимание: при написании примеров к данному учебному пособию мы всегда следовали правилам XHTML.