kopilkaurokov.ru - сайт для учителей

Создайте Ваш сайт учителя Курсы ПК и ППК Видеоуроки Олимпиады Вебинары для учителей

Бегущая строка в HTML

Нажмите, чтобы узнать подробности

Коммуникационные технологии. Бегущая строка в языке разметки HTML.

Просмотр содержимого документа
«Бегущая строка в HTML»

Раздел программы: «Коммуникационные технологии».

Тема урока: «Бегущая строка в языке разметки HTML».

Вид урока: урок с применением современных компьютерных технологий, объяснительный.

Тип урока: комбинированный.

Технология: личностно-ориентированная.

Цель: изучение и первичное знакомство с одним из элементов движения в языке разметки, атрибутов этого элемента, осмысление связей и отношений в объектах изучения.

Задачи:

  • воспитательная - развивать познавательный интерес; воспитывать информационную культуру, усидчивость, интерес к предмету;

  • обучающая – сформировать представление о движущемся элементе–бегущей строке, её атрибутов по установке цвета, размера, стиля, движения;

  • развивающая – расширять кругозор, развивать логическое мышление, навык работы в программах по созданию бегущей строки на Web-странице, с клавиатурой и мышью.

Оборудование: компьютеры на каждого ученика, тест на первичную проверку знаний по новой теме, практическая работа на закрепление пройденного материала.

Программное обеспечение: операционная система WINDOWS ХР, программа Блокнот, Браузер - Internet Explorer, Google Chrome.

Ход урока.
  1. Организационный этап

  2. Этап всесторонней проверки знаний

  3. Этап подготовки учащихся к активному сознательному усвоению нового материала

  4. Этап усвоения новых знаний

  5. Этап первичной проверки знаний

  6. Этап закрепления знаний

  7. Итог урока, информация учащимся о домашнем задании и инструктаж по его выполнению

1. Организационный момент.

Здравствуйте, ребята!

Тема нашего урока «Бегущая строка в языке разметки HTML». Сегодня на уроке мы с вами познакомимся с одним из элементов движения HTML, основными атрибутами для этого элемента, научимся создавать Web-страничку с этим движущимся элементом, заодно закрепим навыки работы в таких программах, как: простой текстовый редактор, программа-браузер. В тетрадях записываем число и тему урока.

2. Этап всесторонней проверки знаний.

Происходит проверка знаний по пройденному материалу в форме беседы:

  1. Что такое язык разметки HTML? (структурированный язык, используемый для создания Web-страниц)

  2. Что является основным объектом разметки? (элемент)

  3. Что входит в элемент? (тэг, атрибут и значение)

  4. Какие бывают тэги? (парные и непарные)

  5. В чём особенность парных тэгов по отношению к непарным? (парный тэг имеет открытый тэг и закрытый)

  6. Какие программы необходимы для создания разметки HTML? (простой текстовый редактор и программа-браузер)

  7. Для чего нам необходим текстовый редактор? (для написания разметки)

  8. Для чего нам необходима программа-браузер? (для преобразования текстового файла в Web-страницу)

3. Этап подготовки учащихся к активному сознательному усвоению нового материала.

А сейчас мы с вами познакомимся с новым элементом нашей разметки – элементом движения. Как мы уже с вами знаем, разметка нам нужна для написания тэгов и преобразования их в Web-страничку, а совокупность этих страничек составляют сайт. Зная определённые правила написания можно создавать свой сайт, а так же его редактировать и форматировать.

4. Этап усвоения новых знаний вместе с практическим применением.

Подготавливаем материал для работы: создаём папку под именем Урок3, открываем её и в ней создаём текстовый документ, вводим в него основные тэги для работы с разметкой и сохраняем как web-страницу Run.html (для просмотра результата).


Вопросы:

  1. Какие основные тэги должны быть в текстовом документе? 

  2. Что означает тэг ? ( и . Пара этих тегов сообщает программе просмотра (браузеру) что между ними заключен документ в формате HTML)

  3. Что означает тэг ead? (Между этими тегами располагается информация о документе (название, ключевые слова для поиска, описание и т.д.) Для того чтобы дать название своему HTML-документу текст помещается между тегами и )

  4. Что означает тэг ? (Тело HTML-документа - это место, куда автор помещает информацию, отформатированную средствами HTML)



Чтобы осуществить «бегущую» строку на web-странице, используется парный тэг . Например: информатика . Учащиеся набирают прорабатывают. Просматриваем результат. Для этого тэга, как и для многих, есть свои атрибуты для форматирования тэга, то есть установки его фона, стиля, размера, направления и т.д. Для тэга есть тоже свои атрибуты. Мы сейчас с ними и познакомимся.

    • direction - направление бегущей строки, у атрибута четыре значения: направо (right), налево (left), вверх (up) и вниз (down). Если мы используем направления направо или налево, то необходимо добавить ещё один атрибут «width» по ширине области вывода строки. Например: элемент
      .  Учащиеся набирают и проделывают.  Если мы используем направления вверх или вниз, то необходимо добавить атрибут «height» по высоте области вывода строки. Например: движения
      .  Учащиеся набирают и проделывают. 

    • Цвет фона бегущей строки – bgcolor, у этого атрибута одно значение – это название цвета (либо по-английски, либо шестнадцатеричный код цвета). Например: языка
      . Учащиеся набирают и проделывают. 

    • Количество проходов – loop, у этого атрибута одно значение – число от -1 (бесконечное число проходов) до любого целого числа.  Например: разметки
      . Учащиеся набирают и проделывают.

    • Вы уже знаете, что тэги можно совмещать. Так и здесь. Для того, что бы придать цвет, стиль, размер нашей строке, необходимо совместить два тэга: и font. Например: Comic Sans MS”html. Учащиеся набирают и проделывают. 



Записать в тетрадях:

Marquee … Marquee - тэг «бегущей строки».

Атрибуты:

  1. direction - направление бегущей строки;

значения: right width – атрибут по ширине области вывода

left строки

up height – атрибут по высоте области вывода

down строки

  1. bgcolor - цвет фона бегущей строки;

  2. loop - количество проходов.



В результате получилась «оживлённая» Web-страничка по данной теме.

5. Этап первичной проверки знаний.

Этот этап проходит в виде теста с самопроверкой по пройденному материалу. Готовый тест раздается каждому ученику. В тесте из двух вариантов по 6 вопросов с тремя вариантами ответов. На тест даётся три минуты и после этого происходит проверка.

Вопросы теста (I вариант):

  1. Какие бывают тэги? (парные и непарные; одиночные; непарные) 

  2. Каким тэгом задаётся «бегущая» строка? (,  и , ) 

  3. Какой тэг задаёт стиль «бегущей» строке? (, и


Получите в подарок сайт учителя

Предмет: Информатика

Категория: Уроки

Целевая аудитория: 11 класс.
Урок соответствует ФГОС

Скачать
Бегущая строка в HTML

Автор: Боттаева Светлана Идирисовна

Дата: 29.01.2019

Номер свидетельства: 497699

Похожие файлы

object(ArrayObject)#849 (1) {
  ["storage":"ArrayObject":private] => array(6) {
    ["title"] => string(100) "Лекция: Программа Microsoft FrontPage 2003. Динамические эффекты. "
    ["seo_title"] => string(70) "liektsiia-proghramma-microsoft-frontpage-2003-dinamichieskiie-effiekty"
    ["file_id"] => string(6) "126145"
    ["category_seo"] => string(11) "informatika"
    ["subcategory_seo"] => string(5) "uroki"
    ["date"] => string(10) "1415119239"
  }
}



ПОЛУЧИТЕ СВИДЕТЕЛЬСТВО МГНОВЕННО

Добавить свою работу

* Свидетельство о публикации выдается БЕСПЛАТНО, СРАЗУ же после добавления Вами Вашей работы на сайт

Удобный поиск материалов для учителей

Ваш личный кабинет
Проверка свидетельства