Содержание
- 2. Введение и основные понятия: Основные сведения о языках разметки: HTML, XML, XHTML. Эволюция языков разметки. Цели
- 3. Понятие языка разметки Одна из наиболее широко используемых форм хранения информации это документ. В документе, помимо
- 4. История 1986 ISO-8879 SGML 1991 CERN HTML 1994 Подготовка HTML 2.0 Консорциум W3 (W3C) www.W3.org март
- 5. Основные понятия Web-сайт Web-сервер Web-адрес Web-страница ...
- 6. Как это работает 1 2 3 4 1 3 2 4 2 1 5 4 3
- 7. Простая HTML страница Пример HTML страницы Мой первый HTML-документ Скоро мы узнаем, что означают эти странные
- 8. Объявление Строгое DTD. Документы, использующие такое объявление типа документа, включают в себя все элементы и атрибуты,
- 9. Структура HTML документа Здесь размещается служебная информация. Пользователь ее не видит. Здесь размещается содержание документа. Именно
- 10. Заголовок документа Заголовок документа ...Содержание документа...
- 11. Тело документа ...Служебная информация... Мой первый HTML документ Некоторый текст. Основное содержание текущей страницы. Первый абзац
- 12. Какие бывают элементы? Блочные (block elements) Структурное форматирование Текстовые (inline elements) Непосредственное форматирование Логическое форматирование (phrase
- 13. Структурированный текст Заголовок первого уровня Элемент P представляет абзац. В нем не могут содержаться элементы уровня
- 14. Как браузер показывает текст?
- 15. Заголовки Заголовок 1 Заголовок 2 Заголовок 3 Заголовок 4 Заголовок 5 Заголовок 6
- 16. Абзац Браузеры, которые интерпретируют мягкие переносы, должны обеспечивать следующую семантику: если строка прекращается в месте мягкого
- 17. Улучшаем страницу Мой дядя самых честных правил, Когда не в шутку занемог, Он уважать себя заставил
- 18. Принудительный разрыв строки Мой дядя самых честных правил, Когда не в шутку занемог, Он уважать себя
- 19. Окончательный вид документа Мой первый документ Мой первый HTML-документ Евгений Онегин А.С.Пушкин (отрывок) Мой дядя самых
- 20. Атрибуты элементов Атрибут Атрибут Тег Имя атрибута Значение атрибута Атрибут
- 21. Используем атрибуты Выровнять по центру Выровнять по правому краю Выровнять по ширине Выровнять по левому краю
- 22. Создаем блочную цитату They went in single file, running like hounds on a strong scent, and
- 23. Авторское форматирование Время – начинаю про Ленина рассказ. Но не потому, что горя нету более, время
- 24. Элемент ADDRESS - контактная информация (Блочный элемент, текст отображается курсивом) Мой адрес: Тула, ул. Советская 31а,
- 25. Группировка элементов Элементы DIV и SPAN вместе с атрибутами id и class обеспечивают общий механизм добавления
- 26. Элементы DIV и SPAN Первый div Второй div Третий div Первый span Второй span Третий span
- 27. Коротко о цвете Диапазон: 00 - FF (0 - 255) #00FF00 – green (зеленый) #FF0000 –
- 28. Раскрашиваем страницу Раскрашиваем страницу Этот текст синего цвета, а этот - красного. Горизонтальная линия тоже может
- 29. Элемент FONT (не желателен) серифный шрифт: Times New Roman, serif рубленый шрифт: Arial, sans-serif моноширинный шрифт:
- 30. Непосредственное форматирование текста - курсив - полужирный - подчеркнутый - перечеркнутый - моноширинный - увеличить шрифт
- 31. Логическое форматирование - выделение важных фрагментов курсивом - выделение особо важных фрагментов полужирным - выделение фрагмента
- 32. Специальные символы
- 33. Дополнительно п.1. Текст п. 1 никогда не будет перенесен браузером. п.2. Но п.3 всегда будет идти
- 34. Лабораторная работа Оформление текста Откройте файл lab-1-1.html Оформите HTML-файл следуя инструкциям, указанным в документе в виде
- 35. Ссылки и иллюстрации: Механизмы адресации на ресурсы в Internet. Реализация механизма в языке HTML Создание гиперссылок
- 36. Переход браузера ... Ссылка 1 Линк 2 Переход 3 ... ... ... Некоторый заголовок ... ...
- 37. Лабораторная работа Создание и использование якорей
- 38. Переход к другому документу Это ссылка на 1.html Это ссылка на 2.html Это ссылка на 3.html
- 39. Лабораторная работа Создание и использование гиперссылок
- 40. Переход к другому документу с меткой текст Пример Ссылка на файл 1.html с меткой "а" В
- 41. Лабораторная работа Создание и использование гиперссылок и якорей
- 42. Примеры абсолютных ссылок на различные файлы по разным протоколам: протокол://имя_сервера:порт/путь Ссылка по протоколу HTTP на стартовую
- 43. Лабораторная работа Создание и использование абсолютных гиперссылок
- 44. Несколько типичных вариантов относительных ссылок href="target.html" href="folder/target.html"
- 45. Несколько типичных вариантов относительных ссылок href="../target.html" folder1 href="../folder/target.html"
- 46. Примеры относительных адресов "info.html" "manual/info.html" "manual" "../help.html" "../project/first.html" "../../about/contact.html" "/" - корень сайта "/demo/" "/images/pic.gif" //В
- 47. В каком окне открывать ссылку? ссылка
- 48. Цвет ссылок цвет неотработанной ссылки (пользователь еще не "кликал" на ссылке). цвет ссылки после щелчка (пользователь
- 49. Атрибуты, явно задающие цвета ссылок Атрибуты : link — цвет неотработанной ссылки alink — цвет активной
- 50. Как показать файл?
- 51. Подписываем картинку Да, и ссылка тоже...
- 52. Лабораторная работа Вставка иллюстраций
- 53. Картинка как ссылка
- 54. Задаем размеры и выравниваем картинку hspace hspace vspace vspace left - горизонтальное выравнивание изображения по левому
- 55. Фоновое изображение документа
- 56. Лабораторная работа Использование иллюстраций
- 58. Скачать презентацию