УДК 004.738.5
ББК 32.973.26-018.2
Т39
Тиге Дж. К.
Т39
DHTML и CSS: Пер. с англ. – М.: ДМК Пресс. – 5 с.: ил. (Быстрый старт).
ISBN 5-94074-169-X
58
В книге описывается использование динамического HTML (DHTML) и каскадных таблиц
стилей (CSS) для построения сложных интерактивных Web-узлов. Данные технологии
не требуют наличия специфического программного обеспечения на компьютерах
посетителей сайта и работоспособны в большинстве распространенных браузеров. С помощью
этой книги вы научитесь создавать динамически обновляющиеся Web-страницы,
включающие различные текстовые и графические эффекты, манипулировать
HTML-таблицами, размещать на своем сайте графику и анимацию.
Рассматриваются способы применения каскадных таблиц стилей, проблемы реализации
поддержки CSS в различных браузерах, использование JavaScript и объектной модели документа
(DOM) для манипулирования содержимым страниц без их перезагрузки с сервера.
Изложение материала сопровождается множеством примеров, даются советы по планированию
структуры сайта и его дизайну. Кроме того, анализируются наиболее распространенные
ошибки, допускаемые при программировании.
Издание предназначено для разработчиков Web-страниц и всех, кто хотел бы создать собственный
динамический Web-сайт.
Authorized translation from the English language edition, entitled DHTML AND CSS FOR THE
WORLD WIDE WEB: VISUAL QUICKSTART GUIDE, 2nd Edition by TEAGUE, JASON CRANFORD,
published by Pearson Education, Inc, publishing as Peachpit Press, Copyright © TEAGUE, JASON
CRANFORD.
All rights reserved. No part of this book may be reproduced or transmitted in any form or by any
means, electronic or mechanical, including photocopying, recording or by any infomation storage
retrieval system, without permission from Pearson Education, Inc.
RUSSIAN language edition published by DMK Press, Copyright ©.
Все права защищены. Любая часть этой книги не может быть воспроизведена в какой бы то
ни было форме и какими бы то ни было средствами без письменного разрешения владельцев
авторских прав.
Материал, изложенный в данной книге, многократно проверен. Но, поскольку вероятность
технических ошибок все равно существует, издательство не может гарантировать абсолютную
точность и правильность приводимых сведений. В связи с этим издательство не несет ответственности
за возможные ошибки, связанные с использованием книги.
ISBN 0-201-73084-7 (англ.)
ISBN 5-94074-169-Х (рус.)
Copyright © Peachpit Press
© Перевод на русский язык, оформление
ДМК Пресс
Стр.5
Содержание
Введение ................................................................................................................... 15
Часть I. Каскадные таблицы стилей .......................................... 23
Глава 1. Введение в CSS ................................................................................ 24
Определение стиля ............................................................................... 26
Каскадные таблицы стилей ................................................................ 27
Версии CSS .............................................................................................. 30
Типы правил CSS ................................................................................... 32
Составляющие CSS-правил ................................................................ 33
Типы HTML-тэгов ................................................................................. 35
Глава 2. Основы CSS......................................................................................... 37
Добавление CSS в HTML-тэг .............................................................. 38
Добавление CSS на Web-страницу .................................................... 40
Добавление CSS на Web-сайт ............................................................. 43
Переопределение HTML-тэга ............................................................ 49
Определение классов для создания тэгов ....................................... 51
Определение ID для идентификации объекта .............................. 54
Создание inline-тэгов ........................................................................... 56
Создание HTML-тэгов блок-уровня ................................................ 58
Определение тэгов с помощью одинаковых правил ................... 60
Определение тэгов в контексте ......................................................... 62
Значение !important .............................................................................. 64
Наследование родительских свойств .............................................. 66
Управление существующими или наследованными
значениями свойств .............................................................................. 68
Определение каскадного порядка .................................................... 70
Настройка CSS для печати .................................................................. 72
Комментарии в CSS .............................................................................. 75
Стратегия создания таблиц стилей ................................................... 76
Стр.8
8 DHTML и CSS
Глава 3. Управление шрифтом................................................................... 78
Оформление в Web .............................................................................. 79
Способы представления текста в Web ............................................. 80
Установка шрифта ............................................................................... 81
Загрузка шрифтов ................................................................................ 83
Шрифты в браузере .............................................................................. 85
Размер шрифта ...................................................................................... 87
Курсив...................................................................................................... 89
Толщина шрифта .................................................................................. 91
Создание minicaps ................................................................................ 92
Определение нескольких значений шрифта одновременно .......... 94
Глава 4. Управление текстом ...................................................................... 96
Кернинг .................................................................................................... 97
Интервал между словами ................................................................... 98
Межстрочные интервалы .................................................................... 99
Заглавные и строчные буквы ............................................................. 101
Выравнивание текста по правому, левому краю
и по центру ............................................................................................. 102
Вертикальное выравнивание текста ................................................. 103
Выделение абзацев в тексте ............................................................... 104
Украшение текста ................................................................................. 106
Управление свойствами пробелов .................................................... 108
Установка разрыва страницы для печати ....................................... 110
Глава 5. Управление списками и указателем мыши...................... 112
Списки ..................................................................................................... 113
Виды маркеров ...................................................................................... 115
Создание висячих отступов ................................................................ 116
Создание собственных маркеров ...................................................... 117
Форма указателя мыши....................................................................... 119
Глава 6. Управление цветами и фоном ................................................. 121
Установка отдельных свойств фона ................................................ 124
Установка цвета на переднем плане ................................................ 129
Глава 7. Управление рамками и полями ............................................... 130
Что такое элемент ................................................................................ 131
Ширина и высота элемента ................................................................ 133
Поле элемента ....................................................................................... 135
Рамка элемента...................................................................................... 137
Атрибуты рамки .................................................................................... 139
Внутренний отступ ............................................................................... 141
Стр.9
Содержание 9
Поля и рамки в таблице ...................................................................... 142
Обтекание текстом ............................................................................... 144
Отмена обтекания текстом ................................................................ 146
Отображение элемента на экране ..................................................... 147
Глава 8. Управление позиционированием ........................................... 150
Что такое окно....................................................................................... 151
Тип позиционирования ........................................................................ 152
Определение положения по отношению к левому
верхнему углу ........................................................................................ 156
Определение положения по отношению к правому
нижнему углу ......................................................................................... 159
Элементы в порядке стека (3D-позиционирование) ................... 161
Абсолютные элементы, встроенные в относительные ................ 163
Относительные элементы, встроенные в абсолютные ................ 164
Глава 9. Управление видимостью элемента ...................................... 167
Определение видимости элемента ................................................... 167
Определение видимой части элемента............................................ 169
Управление невидимой частью.......................................................... 171
Часть II. Динамический HTML ............................................................. 173
Глава 10. Назначение DHTML ........................................................................ 174
Динамический HTML .......................................................................... 174
Особенности DHTML .......................................................................... 175
Причины использования DHTML ..................................................... 177
Flash и DHTML....................................................................................... 178
Проблема выбора ................................................................................. 180
Глава 11. Объектная модель документа ................................................. 182
DOM – путеводитель по Web-странице .......................................... 183
Создание объекта .................................................................................. 185
Обработчики событий ......................................................................... 185
Обнаружение события ......................................................................... 188
Функционирование DOM ................................................................... 189
Определение возможностей браузера ............................................. 194
Определение типа DOM...................................................................... 196
Построение общей DOM .................................................................... 198
Использование общей для браузеров DOM................................... 201
Netscape 4 и встроенные слои ............................................................ 203
Стр.10
10 DHTML и CSS
Глава 12. Среда, в которой вы работаете .............................................. 207
Название и версия браузера ................................................................ 207
Тип операционной системы ............................................................... 210
Размеры экрана...................................................................................... 212
Количество цветов ............................................................................... 214
Размеры окна браузера ........................................................................ 216
Размеры клиентской области окна ................................................... 217
Адрес и название страницы ................................................................ 219
Положение прокрутки страницы ..................................................... 220
Размеры объекта ................................................................................... 222
Левая и верхняя позиции объекта ..................................................... 224
Правая и нижняя позиции объекта ................................................... 226
Z-индекс объекта .................................................................................. 228
Состояние видимости объекта .......................................................... 230
Видимая область объекта ................................................................... 232
Глава 13. Основы динамических технологий........................................ 236
Отображение и сокрытие объектов ................................................. 236
Перемещение объектов....................................................................... 239
Перемещение объекта на заданное расстояние ............................ 241
Перемещение объектов в 3D ............................................................. 243
Прокрутка Web-страницы ................................................................. 246
Видимая область объекта ................................................................... 248
Глава 14. Развитые динамические технологии .................................. 250
Повторный запуск функции .............................................................. 250
Передача события в функцию........................................................... 253
Глобальный обработчик событий ..................................................... 254
Анимационные объекты ..................................................................... 256
Нахождение положения указателя мыши ...................................... 259
Идентификация объекта на экране .................................................. 261
Управление содержанием во фреймах ............................................ 263
Позиционирование окна браузера .................................................... 266
Новое окно браузера ............................................................................ 268
Размеры окна ......................................................................................... 272
Глава 15. Динамические технологии CSS .............................................. 275
Изменение определения ...................................................................... 276
CSS-класс объекта ................................................................................ 278
Добавление нового правила ............................................................... 280
Отмена таблицы стилей ...................................................................... 281
Глава 16. Слои Netscape ................................................................................... 283
Что такое слой Netscape ...................................................................... 284
Создание слоя ........................................................................................ 285
Стр.11
Содержание 11
Импорт внешнего содержимого с помощью слоев
Netscape ................................................................................................... 288
Доступ к слоям с помощью JavaScript ............................................. 290
Изменение слоев с помощью JavaScript .......................................... 293
Отображение содержимого слоев в браузерах,
которые их не поддерживают ............................................................ 295
Глава 17. Internet Explorer для Windows .................................................. 297
Перетекание объектов ......................................................................... 298
Смена страниц ....................................................................................... 299
Эффект размытого изображения ...................................................... 301
Эффект волны ....................................................................................... 302
Часть III. Использование инструментов
для создания DHTML и CSS............................................ 303
Глава 18. Знакомство с GoLive ...................................................................... 304
Интерфейс GoLive ................................................................................ 305
Внедрение CSS........................................................................................ 308
Создание слоя ........................................................................................ 313
Создание DHTML-анимации ............................................................. 315
Глава 19. Введение в Dreamweaver ........................................................... 317
Интерфейс Dreamweaver .................................................................... 318
Внедрение CSS........................................................................................ 321
CSS-редактор ......................................................................................... 323
Создание дополнительного слоя ....................................................... 325
Создание анимации .............................................................................. 327
Часть IV. Динамические Web-сайты ............................................... 331
Глава 20. Понятие о динамических Web-сайтах ................................. 332
Отличительные черты динамического Web-сайта ....................... 333
Что такое гипертекст ........................................................................... 335
Динамический дизайн .......................................................................... 336
Размещение объектов на Web-странице ......................................... 337
Навигация: рекомендации и запреты ............................................... 340
Глава 21. Создание динамического Web-сайта ................................. 344
Шаг 1. Проектирование ....................................................................... 345
Шаг 2. Разработка .................................................................................. 348
Шаг 3. Реализация ................................................................................. 352
Стр.12
12 DHTML и CSS
Глава 22. Разметка Web-страницы ............................................................ 355
Устранение ошибки в Netscape CSS ................................................. 356
CSS и операционная система .............................................................. 358
Заголовки ................................................................................................ 361
Фиксированный заголовок ................................................................. 362
Боковое меню ........................................................................................ 364
Верхние и нижние колонтитулы ....................................................... 366
Границы фреймов ................................................................................. 369
Открытие и закрытие фреймов ......................................................... 371
Размещение страниц во фреймах ..................................................... 376
Отображение страницы на экране и при выводе
на печать .................................................................................................. 379
Глава 23. Импорт внешнего содержимого ............................................ 381
Тэги и
Стр.13
Содержание 13
Глава 26. Специальные эффекты ............................................................... 451
Буквица ................................................................................................... 452
Простая тень .......................................................................................... 454
Объемная тень ....................................................................................... 455
Фединг HTML-текста ........................................................................... 459
Отслеживание указателя мыши ........................................................ 463
Движущиеся объекты .......................................................................... 467
Прозрачная графика в формате PNG .............................................. 470
Создание часов ...................................................................................... 474
Глава 27. Мультимедиа ..................................................................................... 476
Использование звука в Web ................................................................ 477
Анимация в формате GIF .................................................................... 478
Назначение GIF-анимации .................................................................. 482
Flash-анимация ...................................................................................... 484
Видео в Internet ...................................................................................... 490
Добавление Java-апплетов .................................................................. 492
Глава 28. Отладка кода ..................................................................................... 494
Обнаружение ошибок CSS .................................................................. 495
Проверка CSS-правила......................................................................... 497
Определение ошибок в коде JavaScript ........................................... 499
Различия между браузерами .............................................................. 502
Глава 29. Будущее динамического Internet ........................................... 504
Необходимость стандартов ............................................................... 505
Extensible Markup Language ................................................................ 507
Extensible Hypertext Markup Language ............................................. 509
Преобразование HTML в XHTML..................................................... 510
Synchronized Multimedia Integration Language ............................... 512
Масштабируемая векторная графика ............................................. 513
CSS третьего уровня ............................................................................. 514
Приложения .................................................................................................................. 515
Приложение 1. Браузеры, поддерживающие DHTML и CSS ....... 516
Internet Explorer ......................................................................... 517
Netscape Navigator .................................................................... 518
Другие браузеры ....................................................................... 519
Приложение 2. Краткая справка о CSS .................................................... 520
Краткая справка ........................................................................ 521
Стр.14
14 DHTML и CSS
Приложение 3. Краткая справка о DHTML ............................................. 529
Служебные слова ...................................................................... 532
Приложение 4. Шрифты, поддерживаемые браузером................. 534
Приложение 5. Дополнительные инструменты .................................. 539
Программное обеспечение .................................................... 539
В режиме реального времени ................................................ 542
Приложение 6. Дополнительные источники ......................................... 545
Web-сайты: технология и стандарты ................................... 545
Web-сайты: дизайн и теория .................................................. 549
Примеры Web-сайтов .............................................................. 551
Книги, журналы и другие публикации ................................ 552
Предметный указатель ....................................................................................... 554
Стр.15