Добавил:
Upload Опубликованный материал нарушает ваши авторские права? Сообщите нам.
Вуз: Предмет: Файл:
методичка.doc
Скачиваний:
0
Добавлен:
21.01.2020
Размер:
5.96 Mб
Скачать

Інструкція для проведення лабораторного заняття №16 з предмету “Інформатика” Тема: Розробка Веб-сайту

Мета: •Набути практичних навичок створення простих Web –сторінок

•Практичне застосування та засвоєння структури документу та основних елементів мови HTML.

•Набути практичних навичок використання HTML при створенні Web – сторінок.

Робоче місце: Лабораторія інформатики та комп’ютерної техніки

Тривалість заняття: 80 хв.

Матеріальне технічне оснащення робочого місця: ПК, ОС Windows, БЛОКНОТ

Правила охорони праці:

        1. На робочих місцях розташовано обладнання, яке має складові, що працюють під високою напругою. Необережне поводження з апаратурою може призвести до травм. Тому суворо заборонено:

  • вмикати і вимикати апаратуру без вказівки учителя;

  • доторкатись до роз'ємів з'єднувальних кабелів та самих кабелів;

  • доторкатись до екрану та тильної частини монітора;

  • переміщувати увімкнені складові обчислювальної системи (системних блок, монітор тощо),;

  • класти будь-які предмети на системний блок, монітор, клавіатуру;

  • приносити та використовувати носії даних (дискети, компакт-диски) без дозволу вчителя.

Зміст і послідовність завдань Створення найпростішої Web-сторінки

1. Запустіть текстовий редактор Блокнот (Пуск>Програми>Стандартні>Блокнот).

2. Введіть наступний документ:

<HTML>

<HEAD>

<ТIТLЕ> Заголовок документа </ТIТLЕ>

</HEAD>

<BODY>

Зміст

документа

</BODY>

</HTML>

3. Збережіть цей документ під ім'ям fіrst.htm.

  • Перед збереженням переконаєтеся, що скинуто прапорець Не показувати розширення для зареєстрованих типів файлів (Пуск>Настроювання> Властивості папки>Вид). У протилежному випадку редактор Блокнот може автоматично додати в кінець імені розширення .ТХТ.

4. Запустіть програму Іnternet Explorer (Пуск>Програми>Іnternet Explorer).

5. Дайте команду Файл>Відкрити. Клацніть па кнопці Огляд і відкрийте файл fіrst.htm.

6. Подивіться, як відображається цей файл - найпростіший коректний документ HTML. Де відображається вміст елемента TІTLE? Де відображається вміст елемента BODY?

7. Як відображаються слова "Зміст" і "документа", введені в двох окремих рядках? Чому? Перевірте, що відбувається при зменшенні ширини вікна.

  • В цьому розділі ми створили найпростіший документ HTML. Ми познайомилися з особливостями форматування документів HTML і їхнього відображення за допомогою оглядача Іnternet Explorer.

Вивчення прийомів форматування абзаців.

1. Відкрийте документ fіrst.htm у програмі Блокнот.

2. Видаліть весь текст, що знаходиться між тегами <BODY> і </BODY>. Текст, що буде вводитися в наступних пунктах цієї вправи, необхідно помістити після тега <BODY>, а його конкретний зміст може бути кожним.

3. Введіть заголовок першого рівня, уклавши його між тегами <Н1>і </Н1>.

4. Введіть заголовок другого рівня, уклавши його між тегами <Н2> і </Н2>,

5. Введіть окремий абзац тексту, почавши його з тега <Р>. Пробіли і символи перекладу рядка можна використовувати усередині абзацу довільно.

6. Введіть тег горизонтальної лінійки <HR>.

7. Введіть ще один абзац тексту, почавши його з тега <Р>.

8. Збережете цей документ під ім'ям paragraph.htm.

9. Запустіть браузер Іnternet Explorer (Пуск > Програми > Іnternet Explorer).

10. Дайте команду Файл > Відкрити. Клацніть на кнопці Огляд і відкрийте файл paragraph.htm.

11. Подивіться, як відображається цей файл. Установіть відповідність між елементами коду HTML і фрагментами документа, відображуваними на екрані.

  • У цій вправі ми створили документ HTHL з розміткою aбзаців. Ми визначили, як впливають теги HTML на відображення відповідних частин документа.