138001
столько раз учителя, ученики и родители
посетили сайт «Инфоурок»
за прошедшие 24 часа
+Добавить материал
и получить бесплатное
свидетельство о публикации
в СМИ №ФС77-60625 от 20.01.2015
Дистанционные курсы профессиональной переподготовки и повышения квалификации для педагогов

Дистанционные курсы для педагогов - курсы профессиональной переподготовки от 6.900 руб.;
- курсы повышения квалификации от 1.500 руб.
Престижные документы для аттестации

ВЫБРАТЬ КУРС СО СКИДКОЙ 50%

ВНИМАНИЕ: Скидка действует ТОЛЬКО сейчас!

(Лицензия на осуществление образовательной деятельности № 5201 выдана ООО "Инфоурок")

ИнфоурокИнформатикаДругие методич. материалыПрактическая работа по теме "Создание простейшей Web-страницы с использованием текстового редактора"

Практическая работа по теме "Создание простейшей Web-страницы с использованием текстового редактора"

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

Выбранный для просмотра документ Text.doc

библиотека
материалов
Скачать материал целиком можно бесплатно по ссылке внизу страницы.

Учитель информатики МОУ "Лобановская школа" и учитель информатики и физики МОУ "Столбовская школа" Джанкойского района Республики Крым. Педагогический стаж 4,4 года. Окончил Мелитопольский Государственный Педагогический Университет имени Богдана Хмельницкого по специальности "Информатика". Квалификация по диплому "Инженер-программист". Увлечения: спорт, футбол, программирование, web-программирование.

Выбранный для просмотра документ Практическая работа№ 19.doc

библиотека
материалов
Скачать материал целиком можно бесплатно по ссылке внизу страницы.

Практическая работа № 19

Тема: «Создание простейшей Web-страницы с использованием текстового редактора».

Ход работы

  1. Создайте на рабочем столе папку под своей фамилией.

  2. Запустите текстовый редактор Блокнот (Пуск → Все программы → Стандартные → Блокнот)

  3. Напишите общую структуру web-страницы:

hello_html_5b27bd39.png

  1. Сохраните документ как web-страницу с именем Ваша_фамилия.html (Файл → Сохранить как… → Тип файла → Все файлы) в свою папку.

hello_html_f35d9cb.png

  1. Не закрывая Блокнот, просмотрите созданную страницу в браузере.

  2. Вернитесь в Блокнот и добавьте заголовок web-страницы

hello_html_15bb24f1.png

  1. Сохраните страницу и обновите окно в браузере, чтобы посмотреть внесенные изменения.

  2. Скопируйте текст из файла Text.doc, находящийся в папке Практическая работа № 19 и поместите в разделе body, заключив в тег <font>

hello_html_42fb34f1.png

  1. Сохраните страницу и обновите окно в браузере, чтобы посмотреть внесенные изменения.

  2. Скопируйте файл Foto.jpg, находящийся в папке Практическая работа № 19 в свою папку на Рабочем столе.

  3. Добавьте изображение на страницу перед текстом:

hello_html_5032937e.png

  1. Сохраните страницу и обновите окно в браузере, чтобы посмотреть внесенные изменения.

  2. Добавим еще одну надпись и разобьем весь текст на абзацы, для этого внесите следующие изменения:

hello_html_2a832f0.png

  1. Сохраните страницу и обновите окно в браузере, чтобы посмотреть внесенные изменения.

  2. Установим размеры изображения, его выравнивание на странице и горизонтальный отступ от текста, для этого установим следующие атрибуты для тега <img>

hello_html_4ec01a3b.png

  1. Сохраните страницу и обновите окно в браузере, чтобы посмотреть внесенные изменения.

  2. Установим выравнивание для абзацев, для этого установим следующие атрибуты:

hello_html_3a433166.png

  1. Сохраните страницу и обновите окно в браузере, чтобы посмотреть внесенные изменения.

  2. Установим для заголовка <h1> цвет текста – синий, а для текста <font> - зелёный цвет и размер - 6, для этого добавим следующий код:

hello_html_m32f23a51.png

  1. Сохраните страницу и обновите окно в браузере, чтобы посмотреть внесенные изменения:

hello_html_2bf19d94.png

  1. Установите заливку фона страницы жёлтым цветом, для этого добавьте следующий код:

hello_html_m538039fe.png

  1. После текстового блока добавим таблицу следующей структуры:

hello_html_76e8185d.png

hello_html_76e8185d.png

  1. Сохраните страницу и обновите окно в браузере, чтобы посмотреть внесенные изменения.

  2. Добавим заголовок к таблице, для этого используем тег <caption>:

hello_html_m14a37f86.png

  1. Сохраните страницу и обновите окно в браузере, чтобы посмотреть внесенные изменения.

  2. Преобразуем таблицу:

  • установим выравнивание таблицы по центру, размер 75% относительно окна браузера, 3-й размер границ и заливку белым цветом;

  • зададим для заголовка красный цвет и размер текста 6;

  • выполним заливку нечетных строк серебристым цветом;

  • ширину 2-5 столбцов 22% относительно всей ширины таблицы;

  • текст в первом столбце и строке выровнять по центру;

для этого добавим следующие атрибуты:

hello_html_401dad75.png

hello_html_401dad75.png

  1. Сохраните страницу и обновите окно в браузере, чтобы посмотреть внесенные изменения:

hello_html_m105a4936.png

  1. Позовите учителя для проверки результата.

Общая информация

Номер материала: ДБ-044507

Вам будут интересны эти курсы:

Курс повышения квалификации «Табличный процессор MS Excel в профессиональной деятельности учителя математики»
Курс повышения квалификации «Современные информационные технологии и их использование в работе преподавателей. Системы автоматизированного проектирования одежды и организация технологического процесса»
Курс повышения квалификации «Внедрение системы компьютерной математики в процесс обучения математике в старших классах в рамках реализации ФГОС»
Курс повышения квалификации «Организация работы по формированию медиаграмотности и повышению уровня информационных компетенций всех участников образовательного процесса»
Курс повышения квалификации «Облачные технологии в образовании»
Курс «Фирменный стиль» (Corel Draw, Photoshop)
Курс «Оператор персонального компьютера»
Курс «WEB-ВЕРСТКА (HTML, CSS)»
Курс повышения квалификации «Развитие информационно-коммуникационных компетенций учителя в процессе внедрения ФГОС: работа в Московской электронной школе»
Курс повышения квалификации «Применение MS Word, Excel в финансовых расчетах»
Курс профессиональной переподготовки «Управление в сфере информационных технологий в образовательной организации»
Курс профессиональной переподготовки «Теория и методика обучения информатике в начальной школе»
Курс профессиональной переподготовки «Математика и информатика: теория и методика преподавания в образовательной организации»
Курс повышения квалификации «Специфика преподавания дисциплины «Информационные технологии» в условиях реализации ФГОС СПО по ТОП-50»
Курс повышения квалификации «Современные языки программирования интегрированной оболочки Microsoft Visual Studio C# NET., C++. NET, VB.NET. с использованием структурного и объектно-ориентированного методов разработки корпоративных систем»

Благодарность за вклад в развитие крупнейшей онлайн-библиотеки методических разработок для учителей

Опубликуйте минимум 3 материала, чтобы БЕСПЛАТНО получить и скачать данную благодарность

Сертификат о создании сайта

Добавьте минимум пять материалов, чтобы получить сертификат о создании сайта

Грамота за использование ИКТ в работе педагога

Опубликуйте минимум 10 материалов, чтобы БЕСПЛАТНО получить и скачать данную грамоту

Свидетельство о представлении обобщённого педагогического опыта на Всероссийском уровне

Опубликуйте минимум 15 материалов, чтобы БЕСПЛАТНО получить и скачать данное cвидетельство

Грамота за высокий профессионализм, проявленный в процессе создания и развития собственного учительского сайта в рамках проекта "Инфоурок"

Опубликуйте минимум 20 материалов, чтобы БЕСПЛАТНО получить и скачать данную грамоту

Грамота за активное участие в работе над повышением качества образования совместно с проектом "Инфоурок"

Опубликуйте минимум 25 материалов, чтобы БЕСПЛАТНО получить и скачать данную грамоту

Почётная грамота за научно-просветительскую и образовательную деятельность в рамках проекта "Инфоурок"

Опубликуйте минимум 40 материалов, чтобы БЕСПЛАТНО получить и скачать данную почётную грамоту

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