.: Menu :.
Home
Реферати
Книги
Конспекти уроків
Виховні заходи
Зразки документів
Реферати партнерів
Завантаження
Завантажити
Електронні книги


загрузка...

 
��������...
План-конспект уроку на тему "Теги, оформлення списків даних, робота з таблицями." 


План-конспект уроку на тему "Теги, оформлення списків даних, робота з таблицями."

Тема:  Теги, оформлення списків даних, робота з таблицями.
Мета:  Ознайомити учнів із базовими тегами, які використовуються при оформленні списків даних та роботі з таблицями, навчити учнів використовувати ці теги на практиці, розвинути увагу та логічне мислення, акуратність, наполегливість, виховати повагу до оточуючих.
Тип уроку: вивчення нового матеріалу.
Вид уроку: урок – лекція.
Обладнання: Кодоскоп.
Наочність: кодоплівки.
Тривалість: 45 хв.

Література для вчителя:
1. Верлань, Апатова: „Інформатика 10 -11”;
2. Жолдак, Морзе: „Інформатика 7”;
3. Глинський: „Інформатика” (в 2-х книгах);
4. Руденко та інші: „Курс інформатики”;
5. Руденко: „Збірник практичних робіт”;
6. Рівкін: „Основи комп’ютерної грамотності”;
7. Симонович: „Інформатика. Базовий курс”;
8. Могильов, Пакхенер: „Інформатика”.

Література для учнів:
1. Верлань, Апатова: „Інформатика 10 -11”;
2. Руденко: „Збірник практичних робіт”.
План
1. Організаційна частина.
2. Актуалізація опорних знань.
3. Пояснення нового матеріалу:
a) Теги оформлення списків даних
b) Теги роботи з таблицями
4. Закріплення нового матеріалу.
5. Домашнє завдання.
6. Підсумок уроку.

Хід уроку.
1. Організаційна частина:
• Заходжу до класу
• Відмічаю відсутніх
• Перевіряю готовність учнів до уроку
2. Актуалізація опорних знань:
Задаю учням запитання по попередній темі.
1. Що таке гіпертекст?
(Гіпертекст – об’єднання тексту, об’єктів мультимедіа та посилань на інші тексти)
2. Що таке WWW ?
(Система гіпертекстового подання і нформації для використання її в Інтернеті)
3. Що таке пошуковий сервер ?
(Пошуковий сервер – Web – сервер, на якому знаходиться програма пошуку інформації з будь-якої тематики)
4. Які ви знаєте пошукові системи ?
(Yahoo! , Rambler, AltaVista, Яndex, Apport)
5. Які поля містить вікно пошуку ?
(Topic (тема), Authors (автори), Sourse Journals (назва вихідних даних), IDSno (код видання))
6. Що є основною одиницею пошуку інформації ?
(Основною одиницею пошуку інформації є запит до пошукового серверу)
7. Які існують варіанти пошуку ?
(Шляхом вводу url-адреси пошукового сервера або за допомогою кнопки „Поиск” в середовищі Internet Explorer)
8. Як здійснити пошук інформації в середовищі Internet Explorer ?
(Пошук інформації в середовищі Internet Explorer здійснюється за допомогою натискування вказівним пальцем правої руки лівої кнопки миші, коли вказівник миші знаходиться на кнопці «Поиск» )
3. Пояснення нового матеріалу.
Діти, тема сьогоднішнього нашого уроку – Базові структури алгоритмів. Запишіть в зошити тему та план уроку, які ви бачите на кодоплівці. (Демонструю кодоплівку 1).
План.
1. Теги оформлення списків даних
2. Теги роботи з таблицями
Кодоплівка 1
Діти, сьогодні ми з вами познайомимось з тегами, які використовуються при оформленні списків та при роботі з таблицями. Ви вже маєте деякі навики роботи з тегами, сьогодні ви зможете значно розширити та поглибити свої знання. Розглянемо спочатку списки: їх типи та теги, які використовуються при роботі з ними.
Мова HTML підтримує п’ять видів списків, з яких два (списки меню і списки каталогів) вважаються застарівшими і не рекомендуються для використання. Ті три типи, які залишились – це впорядковані списки,  невпорядковані списки і списки визначення. Всі списки являють собою блочні елементи.
При роботі з текстовими процесорами здебільшого використовують два типи списків – впорядковані (нумеровані) і невпорядковані (маркеровані).
Подивіться будь-ласка на кодоплівку (демонструю кодоплівку 2)

 

 

 

 

 

 

 


кодоплівка 2
На цій кодоплівці ви бачите теги, які використовуються для оформлення списків даних. запишіть будь-ласка їх собі в зошити.
Впорядковані і невпорядковані списки створюються приблизно однаковим чином. Список завжди розміщується між відкриваючим і закриваючим тегами списку: <OL> і </OL> у випадку впорядкованого списку; <UL> і </UL> – у випадку невпорядкованого списку.
Всередині списку розміщуються елементи списку. Їх розміщують між тегами <LI> і </LI>, хоч в даному випадку тег можна і опустити, так як в цьому випадку зрозуміло, де він повинен розміщуватись.
Теги <OL>, <UL> і <LI> можуть містити атрибут TYPE=, значення якого вказує на спосіб позначення елементів списку. Впорядковані списки можна нумерувати арабськими цифрами, римськими цифрами, латинськими буквами (як у верхньому, так і в нижньому регістрі). Невпорядковані списки позначаються маркерами у вигляді чорного кружечка (по замовченню), білого кружечка чи квадратика.
Наприклад. (подивіться на кодоплівку.)
 

 

 

 

 

кодоплівка 3
На даній кодоплівці ви бачите приклад програми впорядкованого списку на мові HTML та результат цієї програми.
У випадку не впорядкованого списку програма матиме такий вигляд: (демонструю кодоплівку 4)
<UL>   
<LI> Програмування 
<LI> Алгоритмізація  
 <LI> Проектування  
</UL>
кодоплівка 4
Списки можуть бути вкладеними. Крім того елементи списків можуть містити гіперпосилання, а також теги, що використовуються для форматування і виділення елементів репліки.
Списки визначення починаються з тега <DL> і закінчуються тегом </DL>. Маркери чи нумерація в цих списках не використовується. Список складається з визначальних термінів і відповідних визначень. Визначальні терміни розміщуються між тегом <DT>, а визначення – тегом <DD>. Закриваючі теги можна опускати. Вважаючи, щ визначальні терміни і визначення чергуються, хоч це і не потребується строго. Визначення зображаються на екрані з відступом від лівого краю.
Таблиця – це один з найбільш зручних способів представлення великих об’ємів даних. Мова HTML має багаті можливості по створенні різних видів таблиць.
Подивіться будь-ласка на кодоплівку (демонструю кодоплівку 5)

 

 

 

 

кодоплівка 5
На цій кодоплівці ви бачите теги, які використовуються при роботі з таблицями. Запишіть їх будь-ласка собі в зошити.
1. Таблиця в мові HTML починається з тега <TABLE> і закінчується закриваючим тегом </TABLE>. Текст всередині таблиці повинен бути поміщений в спеціальні теги, визначаючі елементи таблиці (заголовки, строки і комірки).
2. Між тегами <TABLE> і </TABLE> може один раз зустрітися пара тегів <CAPTION> і </CAPTION>, визначаючий заголовок таблиці. Заголовок таблиці розміщується безпосередньо над таблицею (по замовчуванню) чи безпосередньо під таблицею.
3. Далі слідують теги <TR> і </TR>, визначаючі рядки таблиці. Закриваючий тег можна опускати, так як рядок таблиці закінчується перед початком наступного рядка чи разом з таблицею.
4. Кожен рядок таблиці складається з комірок. Комірки позначаються або тегами <TH>, що містять заголовки стовпців і рядків, або тегами <TD>, що містять звичайні дані. Ці теги також являються парними, але закриваючі теги і тут можуть опускатися, так як це не викликає різночитань.
5. Всередині комірок містяться будь-які дані і будь-які теги HTML, допустимі в розділі тіла документа. Наприклад, комірка таблиці може містити вкладену таблицю. Броузери автоматично обчислюють розміри комірок і всієї таблиці, Хоча ці властивості частково можна задати і з допомогою атрибутів.
Ці атрибути ви можете побачити на кодоплівці (демонструю кодоплівку 6). Перепишіть їх собі в зошити.
 
Атрибути елементів, що використовується при створенні таблиці
Атрибут Елемент Призначення
ALIGN= Таблиця, заголовок, рядок, комірка Вирівнювання таблиці по горизонталі; вирівнювання таблиці по горизонталі; розміщення заголовка над чи під таблицею
VALIGN= Рядок, комірка Вирівнювання по вертикалі
WIDTH= Таблиця, комірка Ширина
HEIGTH= Комірка Висота
COLSPAN= Комірка Протяжність в декілька стовпців
ROWSPAN= Комірка Протяжність в декілька рядків
BGCOLOR= Таблиця, комірка Колір фону
CELLSPACING= Таблиця Зазор між комірками
CELLPADDING= Таблиця Зазор між вмістимим комірки і її границею
BORDER= Таблиця Відображення границь комірок і внутрішньої рамки таблиці
Кодоплівка 6
Розглянемо наприклад таку програму для створення таблиці (демонструю кодоплівку 7)
<TABLE BORDER=5>
<CAPTION ALIGN=bottom> Таблица .1 </CAPTION>
<TR><TD ROWSPAN=2></TD><TH COLSPAN=2>Среднее значение</TH></TR>
<TR><TH>Рост</TH><TH>Вес</TH></TR>
<TR><TD>Мужчины</TD><TD ALIGN=center>174</TD><TD ALIGN=center>78</TD></TR>
<TR><TD>Женщины</TD><TD ALIGN=center>165</TD><TD ALIGN=center>56</TD></TR>
</TABLE>
кодоплівка 7
Результат цієї програми ви можете побачити на наступній кодоплівці (демонструю кодоплівку 8)

Кодоплівка 8
4. Закріплення нового матеріалу.
Ви все зрозуміли? Є якісь запитання? Якщо немає то дайте мені відповідь на такі питання:
• Які теги використовують для позначення впорядкованого списку?
(<OL> і </OL>)
• Які теги використовують для позначення не впорядкованого списку?
(<UL> і </UL>)
• Які теги використовують для позначення елементів списку?
(<LI> і </LI>)
• З яких тегів починається таблиця на мові HTML?
(<TABLE> і </TABLE> )
• Які теги визначають рядки таблиці?
(<TR> і </TR>)
• Якими тегами позначаються комірки таблиці?
(<TH>, <TD>)
• Який атрибут відповідає за відображення границь комірок і внутрішньої рамки таблиці?
(BORDER=)
• Який атрибут відповідає за колір фону?
(BGCOLOR=)
• Який атрибут відповідає за висоту?
(HEIGTH=)
• Який атрибут відповідає за ширину?
(WIDTH=)
• Який атрибут відповідає за вирівнювання по вертикалі?
(VALIGN=)


5. Домашнє завдання.
Що ж, я бачу ви не погано засвоїли сьогоднішній матеріал, тож відкрийте свої щоденники та запишіть домашнє завдання. Прочитайте по підручнику сьогоднішню тему, та вивчіть конспект.
6. Підсумок уроку.
На сьогоднішньому уроці ми розглянули теги оформлення списків даних та теги для роботи з таблицями. Ви бачили приклади, як можна використовувати ці теги для створення списків і таблиць на мові HTML і тепер самі зможете їх створювати у своїх Web – сторінках. Якщо до мене немає питань, то урок завершено. До побачення.

Search:
загрузка...

чи застаріла комедія мольєра міщанин-шляхтич

діяльність скаутських організацій в Україні

перехід від міфу до логосу

анна кареніна скорочений зміст

гобсек твори влада золота

прислівник в англ мовы

види память

стан сучасної української сімї Садок вишневий коло хати

конспекти уроків з англійської мови

винаходи 21 століття



Украинская Баннерная Сеть
   
Created by Yura Pagor, 2007-2010