Самоучитель html
(http://htmlbook.ru/samhtml)
Опубликовано: 22.09.2010 Влад Мержевич
.
Содержание
1. Введение в HTML 4
Быстрый старт 4
2. Инструментарий 6
Текстовый редактор 6
Браузер 7
Валидатор 8
Графический редактор 8
Справочник по тегам HTML 8
3. Теги 9
Парные теги 9
Правила применения тегов 10
Атрибуты тегов 12
Структура HTML-кода 13
Типы тегов 17
Теги верхнего уровня 17
Теги заголовка документа 18
Блочные элементы 20
Строчные элементы 20
Универсальные элементы 22
Теги для списков 22
Теги для таблиц 23
Теги для фреймов 23
4. Значения атрибутов тегов 25
Цвет 25
Размер 28
Адрес 30
5. Текст 33
Особенности текста в HTML 33
Абзацы 34
Заголовки 36
Выравнивание текста 37
Начертание 38
Верхний и нижний индексы 40
Спецсимволы 40
6. Ссылки 43
Абсолютные и относительные ссылки 45
Виды ссылок 48
Правила вложений для тега <a> 48
Атрибуты ссылок 49
Ссылка на адрес электронной почты 51
7. Якоря 53
8. Изображения 55
Форматы файлов 55
Добавление рисунка 57
Альтернативный текст 58
Изменение размеров рисунка 61
9. Списки 65
Маркированный список 65
Нумерованный список 68
Список определений 71
10. Таблицы 74
Создание таблицы 74
Атрибуты тега <table> 75
Атрибуты тега <td> 76
Особенности таблиц 78
Выравнивание таблиц 78
Объединение ячеек 80
Вложенные таблицы 82
Заголовок таблицы 86
11. Фреймы 89
Создание фреймов 90
Ссылки во фреймах 94
Границы между фреймами 96
Изменение размеров фреймов 97
Полосы прокрутки 98
Плавающие фреймы 99
12. Валидация документов 102
Проверка данных на валидность 103
Написание корректного кода 110
Исправление ошибок 112
ПРИЛОЖЕНИЕ: КРАТКИЙ СПРАВОЧНИК 123
Введение в html
HTML (HyperText Markup Language, язык разметки гипертекста) — это система верстки, которая определяет, как и какие элементы должны располагаться на веб-странице. Информация на сайте, способ ее представления и оформления зависят исключительно от разработчика и тех целей, которые он перед собой ставит.
Быстрый старт
Чтобы сразу же ввести в курс дела нетерпеливых читателей, предложим им возможность создания веб-страницы без последовательного изучения правил HTML. По крайней мере, вы сумеете убедиться, что создание веб-страниц достаточно простая штука.
В примере 1.1 приведен несложный пример такого кода.
Пример 1.1. Первая веб-страница
HTML 4.01IE 7IE 8IE 9Cr 11Op 11Sa 5Fx 4
<!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>Моя первая веб-страница</title>
</head>
<body>
<h1>Заголовок страницы</h1>
<p>Основной текст.</p>
</body>
</html>
Чтобы посмотреть результат примера в действии, проделайте следующие шаги.
1. В Windows откройте программу Блокнот (Пуск > Выполнить > набрать «notepad» или Пуск > Программы > Стандартные > Блокнот).
2. Наберите или скопируйте код в Блокноте (рис. 1.1).
Рис. 1.1. Вид HTML-кода в программе Блокнот
3. Сохраните готовый документ (Файл > Сохранить как...) под именем c:\www\example11.html, при этом обязательно поставьте в диалоговом окне сохранения тип файла: Все файлы и кодировку UTF-8 (рис. 1.2). Обратите внимание, что расширение у файла должно быть именно html.
Рис. 1.2. Параметры сохранения файла в Блокноте
4. Запустите браузер Internet Explorer (Пуск > Выполнить > набрать «iexplore» или Пуск > Программы > Internet Explorer).
5. В браузере выберите пункт меню Файл > Открыть и укажите путь к вашему файлу.
6. Если все сделано правильно, то в браузере вы увидите результат, как показано на рис. 1.3.
Рис. 1.3. Вид веб-страницы в окне браузера
В случае возникновения каких-либо ошибок проверьте правильность набора кода согласно примеру 1.1, расширение файла (должно быть html) и путь к документу.