Здесь печатаем обычный текст

Лабораторная работа №1

Знакомство с языком HTML

Цель: изучить основные тэги по форматированию текста в языке HTML.

HTML (Hyper-Text Markup Language) — язык гипертекстовой разметки. Данный формат определяет внешний вид документа, взаимное расположение текстовой, графической и мультимедийной информации. Формат HTML –файла достаточно прост. Составление и внесение изменений в файл осуществляется любым текстовым редактором. Для просмотра результатов используется Web–браузер. Основным достоинством HTML–документа является их способность содержать перекрестные ссылки друг на друга. Перекрестные ссылки помогают быстро обратиться к документу с дополнительной информацией по интересующему вопросу, а затем продолжить работу с исходным текстом.

При создании сложных HTMLдокументов, содержащих большое количество изображений, таблиц и перекрестных ссылок, удобнее пользоваться специальными HTML–редакторами. Для создания HTML-страниц широко применяется пакет FrontPage, разработанный фирмой Microsoft. Однако, такой HTML текст чаще всего нуждается в доработке: он избыточен, а в отдельных случаях и неадекватен. Поэтому с помощью HTML–редакторов создается как бы «базовая страница, а затем ее код редактируется вручную.

Любой документ, написанный с помощью языка HTML, состоит из содержимого страницы, т.е. текста, и управляющих символов — тегов. Все тэги HTML обязательно заключаются в угловые скобки <>. Как правило, используется стартовый тэг и завершающий тэг. Завершающий тэг отличается от стартового наличием слэша.

Создание документа HTML

<HTML> – </HTML> — первый и последний тэги любого HTML–документа.

<HEAD> – </HEAD> — Начало и конец заголовка документа.

<TITLE> – </TITLE> — задание названия документа (заголовок окна браузера).

<BODY> – </BODY> — начало и конец тела документа, которое определяет содержание документа.

Прежде, чем приступить к работе, создайте папку с Вашей фамилией.

Запустите программу Internet Explorer ,выполните команду Вид/Просмотр HTML-кода — откроется окно стандартной программы Блокнот. Введите текст:

<HTML>

<HEAD>

<title>Моя первая Web-страница</title>

</HEAD>

<body>

Это моя первая Веб-страница

</body>

</HTML>

Сохраните файл в своей папке под именем Html1.htm (обязательно введите расширение).

Сверните приложение Блокнот. Найдите файл и дважды щелкните по нему. Запустится программа Internet Explorer. Если в тексте необходимы изменения, откройте Блокнот (Вид/Просмотр HTML-кода),введите изменения и сохраните новый текст. Для просмотра исправленного текста нажмите кнопку Обновить в программе Internet Explorer.

Оформление текста

Некоторые теги, помимо имени, могут содержать атрибуты — элементы, дающие дополнительную информацию о том, как браузер должен обработать текущую метку. Общий вид тега с атрибутом таков:

<имя тега имя атрибута = аргумент> текст </имя тега>

<Hx> – </Hx> — (x — цифра от 1 до 6) описывают заголовки шести различных уровней. Заголовок первого уровня самый крупный, шестого уровня — самый мелкий.

<P> – </P> — описывает абзац (завершающий тэг может отсутствовать).

Аргументы:

ALIGN — параметр, определяющий выравнивание абзаца:

ALIGN=CENTER — выравнивание по центру;

ALIGN=RIGHT — выравнивание по правому краю;

ALIGN=LEFT — выравнивание по левому краю.

<BR> — переход на новую строку, не прерывая абзаца.

<B> – </B> — отображение текста жирным шрифтом.

<I> – </I> — отображение текста курсивом.

<U> – </U> — подчеркнутый текст.

<STRIKE> – </STRIKE> — перечеркнутый текст.

<BLOKQUOTE> – </ BLOKQUOTE > — отображение цитат.

<SUB> – </SUB> — отображение подстрочных индексов.

<SUP> – </SUP> — отображение надстрочных индексов.

<TT> – </TT> — использование шрифта с фиксированной шириной символов.

<BIG> – </BIG> — увеличение размера текущего шрифта.

<SMALL> – </SMALL> — уменьшение размера текущего шрифта.

<BASEFONT SIZE=n> — (n –цифра от 1 до 7) – базовое значение размера шрифта.

<FONT SIZE=+\-n> – </FONT> — изменение размера шрифта.

<FONT COLOR=#xxxxx> – </FONT> — установка цвета шрифта:

Aqua — морская волна;

Black — черный;

Blue — голубой;

FuchsiaAqua — малиновый;

Gray — серый;

Green — зеленый;

Lime — ярко-зеленый;

Maroon — темно-красный;

Navy — темно-синий;

Olive — оливковый;

Purple — пурпурный;

Red — красный;

Silver — серебряный;

Teal — темно-морская волна;

White — белый;

Yellow — желтый.

<BODY BGCOLOR=#xxxxx> — изменение цвета фона;

<HR> — горизонтальная линия, может использовать атрибуты:

COLOR — цвет линии;

SIZE — толщина линии в пикселях или процентах от ширины окна;

WIDTH — выравнивание линии;

ALIGN — выравнивание линии;

NOSHADE — рисование без тени;

SHADE — рисование с тенью.

Создайте документ Html2.htm:

<HTML>

<HEAD>

<title>Оформление текста</title>

</HEAD>

<body>

<h1 align=center>Оформление текста</h1>

<p>

<basefont size=4>

Здесь печатаем обычный текст

<p>

<font size = +1>

Здесь увеличиваем текст

</font>

<p>

Здесь печатаем<big>большой</big>и<small> маленький</small>текст

<p>

Можем его <u>подчеркнуть</u> и <strike>перечеркнуть</strike>

</body>

</HTML>

Просмотрите файл с помощью Internet Explorer.

Откройте HTML-код и внесите в него изменения (изменение цвета шрифта, использование горизонтальных линий):

<HTML>

<HEAD>

<title>Оформление текста</title>

</HEAD>

<BODY bgcolor=silver>

<h1 align=center>

<font color=aqua>

Оформление текста

</font>

</h1>

<p>

<basefont size=4>

Наши рекомендации