ISBN 978-5-9275-1329-1 В учебном пособии описываются основы информационных технологий, в частности такие аспекты, как HTML (язык разметки гипертекста) и XHTML (Extended HTML). <...> Описание различных видов DTD для XHTML-документов . <...> 130 4 ВВЕДЕНИЕ В настоящее время базовым языком создания Web-страниц является язык Hypertext Markup Language (HTML), что переводится как Язык Разметки Гипертекста. HTML предназначен для написания гипертекстовых документов, публикуемых в World Wide Web. <...> Тег CENTER центрирует расположение заголовка на Web-странице. <...> -– Тег BR добавляет символ перевода строки и помогает добиться требуемого расположения элементов на Web-странице. <...> > <BR> <!-– Тег IMG показывает, что в Web-страницу будет вставлено изображение. <...> <!-– Тег Р позволяет осуществить предварительное форматирование текста. <...> За дополнительной информацией по данной теме обратитесь на Web-узел <A HREF="http://www.microsoft.com">Microsoft</A>. <...> Строка таблицы задается тегом TR, тег TH обозначает заголовок таблицы, а тег TD – данные таблицы. <...> -– Если добавить тег А с ключевым словом "MAILTO:" в атрибуте HREF, то пользователям будет предоставлена возможность связаться с автором Web-страницы по электронной почте. <...> Концепция XHTML XHTML расшифровывается как eXtensible HypperText Markup Language (расширяемый язык разметки гипертекста) [2]. <...> XHTML – это не принципиально новый язык, это набор дополнительных правил, которые должны соблюдаться при написании HTML кода. <...> Таким образом XHTML – это более "чистая" версия HTML [3]. <...> 14 </body> </html> Для того чтобы браузер верно отображал неправильно размеченные страницы, необходимо включать в него дополнительный код, что соответственно вызовет большую потребность в ресурсах компьютера. <...> Правильно размеченный документ: <p>Это первый абзац.</p> <h1>Этот первый заголовок. <...> Неправильно размеченный документ: <p>Это первый абзац</p> <br> <hr> <img src='xhtml.jpg' alt='xhtml'> <input type='button' value='Кнопка'> Правильно размеченный документ: <p>Это первый абзац <br /> </p> <hr /> <img src='xhtml.jpg' alt='xhtml' /> <input type='button' value='Кнопка' /> Названия тегов в XHTML должны быть написаны строчными буквами <...>
Информационные_технологии._HTML_и_XHTML.pdf
УДК 004.42
Печатается по решению редакционно издательского совета Южного
федерального Университета (протокол №3 от 23 ноября 2015 г.)
Рецензенты:
доктор технических наук, профессор кафедры информатики
Таганрогского института им. А.П.Чехова (филиал) РГЭУ (РИНХ) Витиска
Н.И.;
кандидат технических наук, доцент кафедры систем автоматизированного
проектирования ИТА ИКТИБ ЮФУ Лебедев О.Б.
Костюк А.И., Гушанский С.М., Поленов М.Ю., Катаев Б.В.
Информационные технологии. HTML и XHTML: учебное пособие. –
Таганрог: Изд-во ЮФУ, 2015. – 125 с.
ISBN 978-5-9275-1329-1
В учебном пособии описываются основы информационных технологий, в
частности такие аспекты, как HTML (язык разметки гипертекста) и XHTML
(Extended HTML).
Предназначено для студентов направления 09.03.01 – Информатика и
вычислительная техника, специальности 09.05.01 – Применение и эксплуатация
автоматизированных систем специального назначения. Для всех форм обучения
и слушателей СФПК.
Работа поддержана Минобрнауки РФ в рамках реализации базовой части
госзадания 2014/174 на выполнение НИР (проект № 2336).
ISBN 978-5-9275-1329-1
© ЮФУ, 2015
© А.И. Костюк, 2015
© С.М. Гушанский, 2015
© М.Ю. Поленов, 2015
© Б.В. Катаев, 2015
Стр.2
СОДЕРЖАНИЕ
ВВЕДЕНИЕ .............................................................................................................. 5
1. ЯЗЫК РАЗМЕТКИ ГИПЕРТЕКСТА HTML .................................................... 6
1.1. Текст .............................................................................................................. 6
1.2. Специальные последовательности символов (Escape Sequences) ........... 7
1.3. Флаги (Tags) .................................................................................................. 7
1.4. Структура HTML-документа ...................................................................... 8
1.5. Головная часть документа (Head) ............................................................... 8
1.6. Название документа (Title) .......................................................................... 9
1.7. Тело документа (Body) ................................................................................ 9
1.8. Комментарий (Comment) ............................................................................. 9
Контрольные вопросы ...................................................................................... 13
2. РАСШИРЯЕМЫЙ ЯЗЫК РАЗМЕТКИ ГИПЕРТЕКСТА XHTML .............. 14
2.1. Концепция XHTML .................................................................................... 14
2.2. Сравнение XHTML и HTML. .................................................................... 14
2.3. Описание различных видов DTD для XHTML-документов .................. 18
2.4. Гиперссылки ............................................................................................... 31
2.5. Графические элементы .............................................................................. 41
2.6. Каскадные таблицы стилей CSS ............................................................... 43
2.7. Шрифты ....................................................................................................... 48
2.8. Единицы измерения ................................................................................... 51
2.9. Элемент span ............................................................................................... 51
2.10. Свойства оформления текста .................................................................. 52
2.11. Селекторы ................................................................................................. 54
2.12. Наследование и каскадирование ............................................................. 60
2.13. Поля, границы, отступы ........................................................................... 64
2.14. Управление фоном ................................................................................... 68
2.15. Высота, ширина и обтекание элемента .................................................. 70
2.16. Элемент линейка (hr) ............................................................................... 72
2.17. Блочный элемент div ................................................................................ 72
2.18. Позиционирование элемента .................................................................. 73
2.19. Списки ....................................................................................................... 75
2.20. Таблицы ..................................................................................................... 79
2.21. Карта ссылок ............................................................................................. 87
2.22. Фреймы ...................................................................................................... 90
2.23. Кодировки, метаданные, символьные подстановки ............................. 99
Контрольные вопросы .................................................................................... 104
3. DYNAMIC HTML ............................................................................................ 106
3.1. Поле ввода текста ..................................................................................... 106
3.2. Поле ввода текста, инициализируемое при запуске ............................. 106
3.3. Кнопка ....................................................................................................... 107
3.4. Кнопка в стиле VBScript .......................................................................... 108
3.5. Переключатель ......................................................................................... 109
Стр.3
3.6. Флажок ...................................................................................................... 111
3.7. Список выбора .......................................................................................... 113
3.8. Динамическое формирование документа .............................................. 115
3.9. Запрос на загрузку изображения ............................................................ 117
3.10. Динамическая перезапись документа .................................................. 118
3.11. Динамическое изменение кода ............................................................. 119
3.12. Создание диапазона текста .................................................................... 120
3.13. Динамическая фреймовая структура .................................................... 121
3.14. Определение типа браузера ................................................................... 126
Контрольные вопросы .................................................................................... 127
ЗАКЛЮЧЕНИЕ ................................................................................................... 128
БИБЛИОГРАФИЧЕСКИЙ СПИСОК ................................................................ 130
4
Стр.4