Задание 1. Создание простейшего HTML-файла

1. Создайте личную папку, куда вы будете сохранять все файлы своего сайта.

2. Запустите программу Блокнот (Notepad).

3. Наберите в окне программы простейший файл HTML. «Моя пробная страничка»

4. Сохраните файл под именем PROBNAYA.HTML (обязательно укажите тип файла HTML при сохранении) в личной папке.

5. Для просмотра Web-страницы используйте любую программу браузера (Internet Explorer, Opera, Mozilla Firefox или другую). Для этого, не покидая программу Блокнот (сверните окно на панель задач), откройте личную папку и двойным кликом по файлу PROBNAYA.HTML откройте окно браузера.

При этом фрагмент документа будет иметь такой вид:

< HTML>

<HEAD>

< TITLE> Моя пробная страничка</TITLE>

</HEAD>

Добро пожаловать на мою пробную страничку.

Меня зовут Маша Петрова

Я учусь в Государственном профессиональном образовательном учреждении Ярославской области Ярославский колледж индустрии питания

Мне 17 лет

К сфере моих увлечений относятся занятия танцами, рисование, очень люблю читать

Заходите на мою страничку еще!

</BODY>

</HTML>

Не забывайте каждый раз сохранять текст Web-страницы при ее корректировке в программе Блокнот и обновлять страницу при ее просмотре в программе браузера.

Задание 2. Расположение текста на странице. Теги управления расположением текста.

Существуют специальные команды, выполняющие перевод строки и задающие начало нового абзаца. Кроме того, cуществует команда, запрещающая программе браузера изменять форматирование текста и позволяет точно воспроизвести на экране заданный фрагмент текстового файла. Тег перевода строки <BR> отделяет строку от последующего текста или графики. Тег абзаца <P> тоже отделяет строку, но еще добавляет пустую строку, которая зрительно выделяет абзац. Оба тега являются одноэлементными, тег <P>

– двойной, т.е. требуется закрывающий тег </P>.

<BR> -теги переноса строки.

<I> - текст курсивом.

<PRE>-форматированный текст.

<HR>-рисование линии.

Тег	Комментарий
< P ALIGN= “LEFT”>	Абзац выравнивается по левому краю экрана
< P ALIGN= “RIGHT”>	Абзац выравнивается по правому краю экрана
< P ALIGN= “CENTER”>	Абзац выравнивается по центру экрана
< P ALIGN= “JUSTIFY”>	Абзац выравнивается по ширине экрана, но браузер выполняет это лучшим, возможным для себя способом. Абзац не всегда будет выглядеть так, как было бы после его обработки текстовым процессором

При этом фрагмент документа будет иметь такой вид:

< HTML>

<HEAD>

< TITLE> Моя пробная страничка</TITLE>

</HEAD>

<H1>Добро пожаловать на мою пробную страничку.</H1>

Меня зовут Маша Петрова

<P> Я учусь в Государственном профессиональном образовательном учреждении Ярославской области Ярославский колледж индустрии питания

<P>Мне 17 лет

<P> К сфере моих увлечений относятся занятия танцами, рисование, очень люблю читать

<P ALIGN =RIGHT> <I> Заходите на мою страничку еще!</I>

<HR>

<H2> Распорядок дня </H2>

<PRE>

<B> Время Действие </B> <BR>

_________________________________________________________ <BR>

07:00 Подъем <BR>

08:30…15:30 Колледж <BR>

16:00…18:00 Домашнее задания <BR>

18:00…21:00 Любимые увлечения <BR>

22:00 Отбой <BR>

_______________________________________________________

</PRE>

</BODY>

</HTML>

Сохраните текст с внесенными изменениями в файле PROBNAYA.HTML (меню Файл - Сохранить). Если у вас уже отображается Web-страница, то вам достаточно переключиться на панели задач на программу браузера и обновить эту страницу (кнопка ОБНОВИТЬ). Изменилось ли отображение текста на экране?

Задание 3. Изменение размеров символов на странице и установка текущего шрифта.

Существует два способа управления размером текста, отображаемого браузером:

1. использование стилей заголовка,

2. задание размера шрифта основного документа или размера текущего шрифта.

Используется шесть тегов заголовков: от <H1> до <H6> (тег двойной, т.е. требует закрытия). Каждому тегу соответствует конкретный стиль, заданный параметрами настройки браузера.

Тег шрифта <FONT> позволяет задавать размер текущего шрифта в отдельных местах текста в диапазоне от 1 до 7.

При этом фрагмент документа будет иметь такой вид:

< HTML>

<HEAD>

< TITLE> Моя пробная страничка</TITLE>

</HEAD>

<H1>Добро пожаловать на мою пробную страничку.</H1>

Меня зовут Маша Петрова

<P>Мне 17 лет

<P> К сфере моих увлечений относятся занятия танцами, рисование, очень люблю читать

<P ALIGN =RIGHT> <I> Заходите на мою страничку еще!</I>

<HR>