Тема: Теги HTML. Структура web-страницы. Тело документа. Параграфы и заголовки

 просмотров

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

Тема: Теги HTML. Структура web-страницы. Тело документа.
Параграфы и заголовки.

Цели:

·  иметь представление об основах языка гипертекста HTML;

·  знать структуру языка разметки, основные теги языка HTML;

·  уметь вводить основные теги для сознания простейших Web-страниц.

Простейшая HTML-страница

Уровень 1

Начнём знакомиться с языком HTML. Он не является языком программирования и предназначен для разметки текстовых документов (т. е. для форматирования текста). То, как будет выглядеть текст, - шрифт, выравнивание абзацев и пр. - определяют теги HTML (tags). Всё, что записанно между угловыми скобками из знаков "<" и ">", - это и есть тег.

Как правило, HTML-теги быают парными. Первый тег указывает начало форматируемого фрагмента текста и параметры форматирования, а второй, отличающийся от первого косой чертой "/" перед ключевым словом, указывает конец фрагмента текста - области влияния открывающего тега. Такая пара тегов называется контейнером. Например, тег <html> начинает код web-страницы, а тег </html> - заканчивает его. Между этими двумя основными тегами располагается головная (титульная часть) кода web-страницы и её "тело".

Текст же, не находящийся между угловыми скобками (< и >), предназначен для просмотра в браузере (например, в Internet Explorer).

Создайте папку Практическая работа 1. Откройте текстовый редактор Блокнот и наберите текст HTML-кода (без комментариев справа), который соответствует пустой странице:


Сохраните полученный документ в папку Практическая работа 1, присвоив файлу имя lesson1.html. Здесь .html (либо .htm) - типовое расширение имени файла с HTML-кодом web-страницы.

Запустите браузер Internet Explorer. посмотрите в нём полученную страницу. Для этого выполните двойной щелчок мышью на иконке файла.

Уровень 2

Откройте файл lesson1.html с помощью редактора Блокнот для внесения изменений в HTML-код. В контейнере <head> </head> описываются общие правила отображения HTML-документа и вспомогательная информация. Между тегами <title> и </title> располагается заголовок web-страницы. Введите между тегами <title> и </title> название "Практическая работа 1" и проверьте отображение имени документа на полученной web-странице.

Для этого:

·  в редакторе Блокнот сохраните изменения в HTML-файле (Файл - Сохранить)

·  в браузере обновите web-страницу (кнопка Обновить)

Образец

Уровень 3

Между тегами <body> и </body> располагается на web-странице текст и встраиваемые в него HTML-команды, согласно которым браузер выводит информацию в окне браузера.

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

Контрольные вопросы

Что такое язык HTML? Для чего он нужен? Что такое браузер? Для чего он нужен? Из каких двух основных частей состоит любой HTML-документ? Что такое тег? Что такое контейнер? Чем HTML-теги отличаются от остального текста HTML-документа? Что означает косая черта ("/") перед именем тега? Какие теги описывают общие правила отображения HTML-документа и содержат дополнительную информацию о нём? Между какими тегами располагаются команды, согласно которым браузер выводит текст в своём окне? Между такими тегами располагается имя HTML-документа, которое отображается в заголовке окна браузера? Какие теги обязательно имеются в любом HTML-документе?


Подпишитесь на рассылку:

Проекты по теме:

Основные порталы, построенные редакторами

Домашний очаг

ДомДачаСадоводствоДетиАктивность ребенкаИгрыКрасотаЖенщины(Беременность)СемьяХобби
Здоровье: • АнатомияБолезниВредные привычкиДиагностикаНародная медицинаПервая помощьПитаниеФармацевтика
История: СССРИстория РоссииРоссийская Империя
Окружающий мир: Животный мирДомашние животныеНасекомыеРастенияПриродаКатаклизмыКосмосКлиматСтихийные бедствия

Справочная информация

ДокументыЗаконыИзвещенияУтверждения документовДоговораЗапросы предложенийТехнические заданияПланы развитияДокументоведениеАналитикаМероприятияКонкурсыИтогиАдминистрации городовПриказыКонтрактыВыполнение работПротоколы рассмотрения заявокАукционыПроектыПротоколыБюджетные организации
МуниципалитетыРайоныОбразованияПрограммы
Отчеты: • по упоминаниямДокументная базаЦенные бумаги
Положения: • Финансовые документы
Постановления: • Рубрикатор по темамФинансыгорода Российской Федерациирегионыпо точным датам
Регламенты
Термины: • Научная терминологияФинансоваяЭкономическая
Время: • Даты2015 год2016 год
Документы в финансовой сферев инвестиционнойФинансовые документы - программы

Техника

АвиацияАвтоВычислительная техникаОборудование(Электрооборудование)РадиоТехнологии(Аудио-видео)(Компьютеры)

Общество

БезопасностьГражданские права и свободыИскусство(Музыка)Культура(Этика)Мировые именаПолитика(Геополитика)(Идеологические конфликты)ВластьЗаговоры и переворотыГражданская позицияМиграцияРелигии и верования(Конфессии)ХристианствоМифологияРазвлеченияМасс МедиаСпорт (Боевые искусства)ТранспортТуризм
Войны и конфликты: АрмияВоенная техникаЗвания и награды

Образование и наука

Наука: Контрольные работыНаучно-технический прогрессПедагогикаРабочие программыФакультетыМетодические рекомендацииШколаПрофессиональное образованиеМотивация учащихся
Предметы: БиологияГеографияГеологияИсторияЛитератураЛитературные жанрыЛитературные героиМатематикаМедицинаМузыкаПравоЖилищное правоЗемельное правоУголовное правоКодексыПсихология (Логика) • Русский языкСоциологияФизикаФилологияФилософияХимияЮриспруденция

Мир

Регионы: АзияАмерикаАфрикаЕвропаПрибалтикаЕвропейская политикаОкеанияГорода мира
Россия: • МоскваКавказ
Регионы РоссииПрограммы регионовЭкономика

Бизнес и финансы

Бизнес: • БанкиБогатство и благосостояниеКоррупция(Преступность)МаркетингМенеджментИнвестицииЦенные бумаги: • УправлениеОткрытые акционерные обществаПроектыДокументыЦенные бумаги - контрольЦенные бумаги - оценкиОблигацииДолгиВалютаНедвижимость(Аренда)ПрофессииРаботаТорговляУслугиФинансыСтрахованиеБюджетФинансовые услугиКредитыКомпанииГосударственные предприятияЭкономикаМакроэкономикаМикроэкономикаНалогиАудит
Промышленность: • МеталлургияНефтьСельское хозяйствоЭнергетика
СтроительствоАрхитектураИнтерьерПолы и перекрытияПроцесс строительстваСтроительные материалыТеплоизоляцияЭкстерьерОрганизация и управление производством

Каталог авторов (частные аккаунты)

Авто

АвтосервисАвтозапчастиТовары для автоАвтотехцентрыАвтоаксессуарыавтозапчасти для иномарокКузовной ремонтАвторемонт и техобслуживаниеРемонт ходовой части автомобиляАвтохимиямаслатехцентрыРемонт бензиновых двигателейремонт автоэлектрикиремонт АКППШиномонтаж

Бизнес

Автоматизация бизнес-процессовИнтернет-магазиныСтроительствоТелефонная связьОптовые компании

Досуг

ДосугРазвлеченияТворчествоОбщественное питаниеРестораныБарыКафеКофейниНочные клубыЛитература

Технологии

Автоматизация производственных процессовИнтернетИнтернет-провайдерыСвязьИнформационные технологииIT-компанииWEB-студииПродвижение web-сайтовПродажа программного обеспеченияКоммутационное оборудованиеIP-телефония

Инфраструктура

ГородВластьАдминистрации районовСудыКоммунальные услугиПодростковые клубыОбщественные организацииГородские информационные сайты

Наука

ПедагогикаОбразованиеШколыОбучениеУчителя

Товары

Торговые компанииТоргово-сервисные компанииМобильные телефоныАксессуары к мобильным телефонамНавигационное оборудование

Услуги

Бытовые услугиТелекоммуникационные компанииДоставка готовых блюдОрганизация и проведение праздниковРемонт мобильных устройствАтелье швейныеХимчистки одеждыСервисные центрыФотоуслугиПраздничные агентства