Основные элементы HTML-файла»

Цель работы: получить навыки создания и редактирования простейших страниц HTML.

Порядок выполнения работы:

Задание 1. Вызовите текстовый редактор БЛОКНОТ. Наберите следующий ниже текст и сохраните под именем web1.html.

<HTML>

<HEAD>

<TITLE>Моя персональная страничка (заголовок для браузера) </TITLE>

</HEAD>

<BODY>

ПРИВЕТ! Это моя личная домашняя страничка! Меня зовут (……………………).

</BODY>

</HTML>

1.1 Задайте цвет фона и цвет текста для Web-страницы, отличные от установленных по умолчанию.

Загрузите файл web1.html в Internet Explorer. Оцените результат.

Расположите каждую фразу в теле документа на новой строке.

Загрузите файл web1.html в Internet Explorer. Оцените результат.

Расположите текст в теле документа по центру.

Загрузите файл web1.html в Internet Explorer. Оцените результат.

1.4 Выделите текст в теле документа стилем заголовок 1-го уровня (тег <H1>).

Загрузите файл web1.html в Internet Explorer. Оцените результат.

Задание 2. Откройте файл web1.html в БЛОКНОТЕ и дополните тело документа нижеуказанным фрагментом. Пропуски в тексте заполните индивидуальной информацией. После редактирования файл web1.html сохраните под именем web2.html.

<HR>

<H2> Мой город </H2>

<p>Я живу в Минске

<H3 ALIGN =Left> Моя работа </H3>

<p ALIGN = Left> Я учусь в ……

<H4 ALIGN = Center> Мои увлечения </H4>

<p ALIGN = Center> Мои увлечения ‑ ……

<H5 ALIGN = Right> Мои коллеги </H5>

<p ALIGN = Right> Мои коллеги ….. </p>

<br>

<HR>

<H6 ALIGN = Center> Design by "…………" </H6>

Задайте цвет линий, их ширину и высоту, выравнивание по центру Web-страницы.

Загрузите файл web2.html в Internet Explorer. Оцените результат.

В разделе Мои увлечения добавьте нумерованный список из 5 пунктов. Нумерацию выполнить римскими цифрами.

Загрузите файл web2.html в Internet Explorer. Оцените результат.

В разделе Мои коллеги добавьте маркированный список из 5 пунктов. В качестве маркера использовать незакрашенный круг.

Загрузите файл web2.html в Internet Explorer. Оцените результат.

Дополните описания списков всплывающими подсказками.

Загрузите файл web2.html в Internet Explorer. Оцените результат.

Задание 3. Откройте файл web2.html в БЛОКНОТЕ и отредактируйте тело документа. После редактирования файл web2.html сохраните под именем web3.html.l

Задайте для каждого заголовка: цвет шрифта, размер (1..7), гарнитуру по своему выбору.

Загрузите файл web3.html в Internet Explorer. Оцените результат.

3.2 В разделе Мои увлечения нумерованный список из 5 пунктов отформатируйте курсивом (<I>).

Загрузите файл web3.html в Internet Explorer. Оцените результат.

3.3 В разделе Мои коллеги маркированный список из 5 пунктов отформатируйте жирным начертанием (<В>).

Загрузите файл web3.html в Internet Explorer. Оцените результат.

Раздел Design by выделите подчеркиванием.

Загрузите файл web3.html в Internet Explorer. Оцените результат.

Задание 4. Создайте HTML-документ следующего вида:

Имя файла – web4.html

Заголовок документа <TITLE> - Советы по изготовлению страничек

Тело документа:

Тиканье, мерцание, перемещение, прокрутка…

Эти новые спецэффекты повсюду на Web.

Полезные советы!

- По возможности избегайте пиктограммы "В процессе производства";

- Не перегружайте страницу большими изображениями;

- Проверяйте орфографические ошибки;

- Проверяйте как можно чаще ссылки на странице.

Загрузите файл web4.html в Internet Explorer. Оцените результат.

4.1 Тело документа оформите с помощью контейнера <PRE>.

Загрузите файл web4.html в Internet Explorer. Оцените результат.

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

Сеть Интернет

Гипертекст

Обозреватель

<dl>

<dt>Сеть интернет

<dd>…..

<dt>Гипертекст

<dd> …..

<dt>Обозреватель

<dd> …..

</dl>

Сохраните под именем web5.html.

Выделите каждый термин красным цветом, жирным начертанием.

Загрузите файл web5.html в Internet Explorer. Оцените результат

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

«Web-страницы. Создание списков. Вставка графики.»

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

Порядок выполнения работы:

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