Практическая работа №1 Тема: Цели:
advertisement
Практическая работа №1 Тема: Теги HTML. Структура web-страницы. Тело документа. Параграфы и заголовки. Цели: иметь представление об основах языка гипертекста HTML; знать структуру языка разметки, основные теги языка HTML; уметь вводить основные теги для сознания простейших Web-страниц. Простейшая HTML-страница Уровень 1 Начнём знакомиться с языком HTML. Он не является языком программирования и предназначен для разметки текстовых документов (т.е. для форматирования текста). То, как будет выглядеть текст, - шрифт, выравнивание абзацев и пр. - определяют теги HTML (tags). Всё, что записанно между угловыми скобками из знаков "<" и ">", - это и есть тег. Как правило, HTML-теги быают парными. Первый тег указывает начало форматируемого фрагмента текста и параметры форматирования, а второй, отличающийся от первого косой чертой "/" перед ключевым словом, указывает конец фрагмента текста - области влияния открывающего тега. Такая пара тегов называется контейнером. Например, тег <html> начинает код web-страницы, а тег </html> - заканчивает его. Между этими двумя основными тегами располагается головная (титульная часть) кода web-страницы и её "тело". Текст же, не находящийся между угловыми скобками (< и >), предназначен для просмотра в браузере (например, в Internet Explorer). 1. Создайте папку Практическая работа 1. 2. Откройте текстовый редактор Блокнот и наберите текст HTML-кода (без комментариев справа), который соответствует пустой странице: 3. Сохраните полученный документ в папку Практическая работа 1, присвоив файлу имя lesson1.html. Здесь .html (либо .htm) - типовое расширение имени файла с HTML-кодом web-страницы. 4. Запустите браузер Internet Explorer. посмотрите в нём полученную страницу. Для этого выполните двойной щелчок мышью на иконке файла. Уровень 2 1. Откройте файл lesson1.html с помощью редактора Блокнот для внесения изменений в HTML-код. 2. В контейнере <head> </head> описываются общие правила отображения HTMLдокумента и вспомогательная информация. Между тегами <title> и </title> располагается заголовок web-страницы. 3. Введите между тегами <title> и </title> название "Практическая работа 1" и проверьте отображение имени документа на полученной web-странице. Для этого: в редакторе Блокнот сохраните изменения в HTML-файле (Файл Сохранить) в браузере обновите web-страницу (кнопка Обновить) Образец Уровень 3 Между тегами <body> и </body> располагается на web-странице текст и встраиваемые в него HTML-команды, согласно которым браузер выводит информацию в окне браузера. 1. Введите с клавиатуры между этими тегами строки стихотворения отформатируйте его так, чтобы результат получился как на рисунке ниже: и Контрольные вопросы 1. 2. 3. 4. 5. 6. 7. 8. 9. Что такое язык HTML? Для чего он нужен? Что такое браузер? Для чего он нужен? Из каких двух основных частей состоит любой HTML-документ? Что такое тег? Что такое контейнер? Чем HTML-теги отличаются от остального текста HTML-документа? Что означает косая черта ("/") перед именем тега? Какие теги описывают общие правила отображения HTML-документа и содержат дополнительную информацию о нём? Между какими тегами располагаются команды, согласно которым браузер выводит текст в своём окне? Между такими тегами располагается имя HTML-документа, которое отображается в заголовке окна браузера? Какие теги обязательно имеются в любом HTML-документе?
