Добавил:
Upload Опубликованный материал нарушает ваши авторские права? Сообщите нам.
Вуз: Предмет: Файл:
Система интернет. Лабараторка 3.doc
Скачиваний:
11
Добавлен:
08.11.2018
Размер:
136.19 Кб
Скачать

Часть 2.

В этой части мы создаем заголовок нашего сайта – файл “verh.html”.

2.1. Oткройте файл verh.html. Следующей ссылкой файл our_style.css присоедините к этой странице:

<link href=" our_style.css " rel="stylesheet" type="text/css" />

Создайте таблицу из двух столбцов и одной строки.

Для таблицы выберите следующие параметры:

Строки – 1, число строк; Столбцы – 2, число столбцов;

Ширина таблицы100%, ширина таблицы (в процентах от экрана);

Поля ячеек – 0, расстояние от объекта (то, что внутри ячейки) до ее границы;

Интервал ячеек – 0, расстояние между ячейками.

Толщина таблицы – 0, толщина рамки.

Для первой ячейки задайте следующие параметры: width="253" height="156". Для этого в теге <td>, отвечающем за первую ячейку нажмите на пробел, и в раскрывающемся меню установите параметры width="253" height="156". В качестве фона для первой ячейки используйте файл “ris1.gif”, а для второй – “poloska.gif” из папки “top”.

Посмотрите результат в нижнем окне.

2.2. В первую ячейку вставьте баннер prep.gif из папки top”, созданный преподавателем. Напомним, что баннер – это графический файл и ставиться с помощью вкладки “Вставка=>Изображение” между тегами <td>….</td> данной ячейки. Используя теги <pre>….</pre>, расположите этот рисунок в центре ячейки. Обратите внимание на его текст, и в конце лаб. работы этот баннер поменяйте на свой. Тег <pre> пишется перед фрагментом <img src="top/prep.gif">, а тег </pre> - после.

2.3. А теперь во вторую ячейку таблицы вставьте таблицу из трех строк и одного столбца со следующими параметрами:

Строки – 3, число строк; Столбцы – 1, число столбцов;

Ширина таблицы98%, ширина таблицы (в процентах от экрана);

Поля ячеек – 0, расстояние от объекта (то, что внутри ячейки) до ее границы;

Интервал ячеек – 0, расстояние между ячейками.

Толщина таблицы – 0, толщина рамки.

Прижмите эту таблицу к верхней границе второй ячейки первой таблицы (с помощью атрибута valign="top").

2.4. В нижнем окне мышью выделите эту новую таблицу. На панели Свойства в меню Выровнять выберите По центру, т.е. центрируйте таблицу относительно ячейки (Если у Вас не получится, то сделайте эту процедуру вручную, добавив после width="98%" выражение align="center").

2.5. В первую строку вставьте рисунок “polk.gif” из папки “top” со следующими параметрами:

width="490" height="50". За ним добавьте горизонтальную линию:

<hr size="5" color="#0000FF" width="100%">.

2.6. Во вторую ячейку вставьте бегущую строку со следующими параметрами (скопируйте этот фрагмент и поставьте во вторую ячейку):

<marquee width="100%" hspace="2" vspace="2" align="top" direction="left"

loop="infinity" behivior="scroll" scrollamount="5" scrolldelay="130">

<strong>Общие потери СССР за годы Великой Отечественной Войны составили 27 миллионов человек </strong> </marquee>

В файле our_style.css создайте новый стиль .begushiy, содержащий два параметра: цвет текста - желтый; размер текста – 16 пикселей. Примените этот стиль для данной бегущей строки.

2.7. В третью ячейку добавьте текст ВТОРАЯ МИРОВАЯ ВОЙНА (1941–1945): цвет текста – белый; высота текста –24 пикселей. Прижмите эту строку к правой границе.

2.8. Откройте файл verh.html в Internet Explorer’e

ЕСЛИ БЕГУЩАЯ СТРОКА НЕ ПОПАДАЕТ В ЦЕНТР ВТОРОЙ ЯЧЕЙКИ ТЕКУЩЕЙ (второй) ТАБЛИЦЫ, ТО С ПОМОЩЬЮ МЫШИ ПОМЕНЯЙТЕ ВЫСОТУ ЯЧЕЙКИ.

Вы должны получить примерно след. картину:

Сохраните файл verh.html.