Головна » Інформатика |
Мета: Навчальна: опанувати технологію і методи створення форм в HTML-документах Розвивальна: розвивати логічне мислення, пізнавальний інтерес до дисципліни та обраної спеціальності; Виховна: виховувати акуратність у веденні електронної документації
А. Наочні посібники: Відеокліп, слайди_______________________ Б. Роздатковий матеріал: Індивідуальні завдання_______________ В. ТЗН: ПК (ноутбук), мультимедійний проектор, PowerPoint___ Г. Література: 1.Методи та засоби Інтернет-технологій: навч. посібник/ В.В. Самсонов, А.Л. Єрохін. - Х., 2008. - 264с. 2.А. Кириленко Самоучитель HTML - Спб.: Питер; Киев: Издательская группа BHV, 2006 - 272 c. [96-111] 3. Квинт И. HTML и CSS на 100%. – Спб.: Питер, 2008. – 352 с.[136-163]
ПЛАН ЗАНЯТТЯ І. Організаційний момент 1. Перевірка присутніх на занятті. 2. Поточний інструктаж з техніки безпеки (з використанням слайдів) ІІ. Актуалізація опорних знань студентів Фронтальне опитування студентів (запитання винесені на слайди)
ІІІ. Виконання лабораторної роботи № 11 Обговорення послідовності створення форми (використання ТЗН та власних наочних посібників) Створення форми згідно з індивідуальним завданням (роздатковий матеріал)
IV. Закріплення вивченого матеріалу Тестові завдання (за наявності часу)
V. Підведення підсумків заняття Оцінювання знань студентів
VІ. Пояснення домашнього завдання. Оформити звіт до лабораторної роботи №11 за вказаною літературою: 1.Методи та засоби Інтернет-технологій: навч. посібник/ В.В. Самсонов, А.Л. Єрохін. - Х., 2008. - 264с. [85-91] 2.А. Кириленко Самоучитель HTML - Спб.: Питер; Киев: Издательская группа BHV, 2006 - 272 c. [82-111,128-140] 3. Квинт И. HTML и CSS на 100%. – Спб.: Питер, 2008. – 352 с.[106-160]
Склав викладач ____________ В.М. Ткаченко
ЛАБОРАТОРНА РОБОТА №11 МЕТА: опанувати технологію і методи створення форм в HTML-документах. Обладнання: Персональна ЕОМ IBM-PC.
1.Повторити теоретичний матеріал з теми «Конструювання форм» (опитування) 2. У редакторі “Блокнот” створити файл: - форму згідно з індивідуальним завданням; - задати ім’я файлу Prog_11.htm; - файл зберегти в раніше створеній директорії. При створенні форми використати наступні елементи та параметри: створення текстового поля <input type=”text” name=”firstname” size="40" maxlength="20"> створення поля для введення інформації, коментарів <textarea name="comments"></textarea> створення кнопок Подача запросу та Скинути <input type=”submit” value="Подача запросу"> <input type=”reset” value="Скинути"> створення прапорців вибір_1 <input type=”checkbox” name="selection" value="yes" checked > вибір_1 <input type=”radio” name="sel" value="select"> створення випадаючого списку …
3. Запустити програму-браузер MS Internet Explorer і відкрити в ній створений файл. 4. Переглянути вид отриманих HTML-сторінок і вивести їх на друк. * Виконати тестові завдання (Робочий стіл-MyTestХ-LR_Form_WD)
Зміст звіту: Роздрукований (переписаний) код HTML-сторінки
1.Методи та засоби Інтернет-технологій: навч. посібник/ В.В. Самсонов, А.Л. Єрохін. - Х., 2008. - 264с. 2.А. Кириленко Самоучитель HTML - Спб.: Питер; Киев: Издательская группа BHV, 2006 - 272 c. 3. Квинт И. HTML и CSS на 100%. – Спб.: Питер, 2008. – 352 с.
ЗАПИТАННЯ З ТЕМИ «Конструювання форм”
Для чого призначені форми?
ТЕСТОВІ ЗАВДАННЯ до лабораторної роботи №11 «Створення форм у HTML-сторінках» Який або які з наступних фрагментів HTML-коду містять помилки? <FORM action=mailto:mymail@mail.dom method=post enctype=application/x-wwtf-form-rlencoded></FORM> <FORM action=mailto:mymail@mail.dom method=get enctype=text/plain></FORM> <FORM action=mailto:mymail@mail.dom method=post enctype=text/plain></FORM> <FORM action=mailto:mymail@mail.dom method=post enctype=plain></FORM> <FORM action=mailto:mymail@mail.dom method=post enctype=text></FORM> Що означає, якщо атрибут METHOD має значення GET? Форма приймає дані Дані не відсилаються формою Форма посилає дані разом з URL Який або які з наступних фрагментів HTML-коду містять помилки? <INPUT type=text value="Введіть текст: "> <INPUT type=text name=itext vаluе="Введіть текст: "> <INPUT type=text name=itext> Введіть текст </INPUT> Введіть текст: <INPUT type=text name=itext> 4. Що вказує атрибут ACTION тега FORM? Стиль елементів форми Дія, при активації елементів форми Який або які з наступних фрагментів HTML-коду кнопки відправки даних містять помилки? <INPUT type=button value=submit> <INPUT type=submit value=OK> <INPUT type=submit name=OK>OK</INPUT> <INPUT type=submit name=OK> <INPUT type=image src=ok.gif value=OK> За допомогою яких атрибутів можна задати «довжину і висоту» елемента textarea? width / height cols / rows size length Всі варіанти невірні Який або які з наступних фрагментів HTML-коду містять помилки? <ТЕХТАRЕА>Введите длинный текст</ТЕХТАRЕА> <TEXTAREA name=ltext> Введите длинный текст</ТЕХТАRЕА> <TEXTAREA name=ltext value =Введите длинный текст >Введите длинный текст</TEXTAREA> <TEXTAREA name=ltext value =Введите длинный текст> Який атрибут елемента form вказує скрипт, який буде обробляти дані форми? Action Method Name Accept Enctype У текстове поле <input type="text" size="3" maxlength="3" disabled="disabled"> (продовжіть) Можна ввести не більше трьох символів Можна ввести скільки завгодно символів, але тільки 3 будуть відображатися Можна ввести скільки завгодно символів і всі будуть відображатися Текст ввести неможливо Всі варіанти невірні Який з наведених нижче варіантів описує кнопку, яка здійснює передачу даних форми на сервер? <input type="submit" value="відправити"> <input type="button" value="відправити"> <input type="reset" value="відправити"> <input type="hidden" value="відправити"> Всі варіанти вірні Який з наведених нижче варіантів є коректним? <form><input type="file" size="30"></form> <form enctype="multipart/form-data"><input type="file" size="30"></form> <form enctype="file"><input type="file" size="30"></form> <form method="post"><input type="file" size="30"></form> ІНДИВІДУАЛЬНІ ЗАВДАННЯ до лабораторної роботи № 11 по темі «Створення форм у HTML-сторінках»
Схожі навчальні матеріали: |
Всього коментарів: 0 | |