Создание бегущей строки
Задание 14.4.Создать на web-странице бегущую строку с произвольным текстом.
Рекомендации по выполнению
· Установите курсор в любое место web-страницы.
· Создайте бегущую строку:
- выполните команду Вставка/Веб-компонент/Бегущая строка;
- в открывшемся окне Свойства бегущей строки в поле Текст введите текст бегущей строки, например Учимся оформлять страницу.
Примечание. Поле Текст будет заполнено автоматически в случае предварительного выделения нужного текста на странице.
- изучите и при необходимости измените параметры перемещения текста (Направление, Скорость, Поведение) и формат строки (размер, цвет, фон и др.).
· Сохраните страницу. Просмотрите полученную страницу в браузере.
Задание 14.5.Создать произвольный эффект из нескольких бегущих строк.
Рекомендации по выполнению
· Создайте бегущую строку длиной в полэкрана.
· Скопируйте строку в буфер и вставьте одну копию рядом с имеющейся и две копии строкой ниже.
· Задайте различные эффекты движения всем строкам.
· Сохраните страницу. Просмотрите результат в браузере.
Управление параметрами web-страницы
Задание 14.6.Присвоить web-странице Web_1 сокращенное название своего факультета.
Примечание.Название web-страницы отображается в браузере на ярлыке вкладки.
Рекомендации по выполнению
· Откройте окно свойств страницы командой Файл/Свойства.
· На вкладке Общие в поле Название замените стандартное название своим текстом (например, ФФБД).
· На вкладке Языкв области Язык страницыустановите основный язык страницы русский и в области Набор знаков – кодировку страницы Кириллица.
· Сохраните страницу. Просмотрите результат в браузере.
Создание web-сайта
Задание 14.7.Создать web-сайт своего факультета в виде фреймовой структуры.
& Фреймы (англ. frame – кадр) – области, на которые делится окно браузера. Они располагаются вплотную друг к другу. В каждую из таких областей загружается самостоятельная web-страница. Механизм фреймов позволяет открывать документ в одном фрейме, по ссылке, нажатой в совершенно другом фрейме. Допустимо также использовать вложенную структуру фреймов, что позволяет дробить фреймы на более мелкие области.
Пример схемы страницы фреймовой структуры представлен на рис. 14.2. В первый фрейм загружается заголовок сайта, во второй – меню, в третий – основное содержимое сайта, а в четвертый – сведения об авторе.
1. Заголовок | |
2. Меню | 3.Содержимое сайта |
4. Автор |
Рис. 14.2. Схема страницы фреймовой структуры
Рекомендации по выполнению
· Выполните команду Файл/Создать/Веб-узел/Одностраничный веб-узел.
· Задайте папку сохранения web-сайта: в окне Создание в поле Укажите расположение нового веб-узла с помощью кнопки [Обзор] выберите адрес своей папки, в которой нужно сохранить web-сайт, например D:\Мои документы\Группа\Primer2.
· Выберите шаблон web-сайта Одностраничный веб-узели нажмите [OK].
· Создайте страницу web-сайта в виде страницы фреймовой структуры:
- выполните команду Файл/Создать/Страница;
- в окне Создание на вкладке Страница выберите группу шаблонов Страницы рамок, шаблон Колонтитулы и оглавление;
- нажмите [OK].
Примечание.Кнопка[Задать начальную страницу] используется для выбора заранее созданной web-страницы (если таковая имеется). Кнопка [Создать страницу] позволяет создать новую web-страницу.
· Создайте заголовочную web-страницу в области 1 (в соответствии с рис. 14.2):
- нажмите кнопку [Создать страницу];
- введите текст этой страницы, например название своего факультета;
- выполните шрифтовое и фоновое оформление страницы.
· Аналогично, нажав кнопку [Создать страницу], создайте страницу в области 2 меню. В ней разместите перечень основных разделов сайта в виде маркированного или нумерованного списка, например:
ü Деканат
ü Специальности
ü Кафедры
ü Советы первокурсникам
· В области 3 создайте страницу, содержащую основную информацию о факультете: декан, количество специальностей, контактный телефон и т.д. Выполните шрифтовое и фоновое оформление страницы.
· В области 4 создайте страницу со сведениями о себе: фамилия, имя, группа, место работы и др. Выполните шрифтовое и фоновое оформление страницы.
Задание 14.8.Сохранить страницу фреймовой структуры в папкеD:\Мои документы\Группа\Primer2.
Рекомендации по выполнению
· Откройте окно Сохранитькомандой Файл/Сохранить.
· В полеИмя файлазадайтеимя начальной web-страницы фреймовой структуры (сохраняется первой – выделяется жирной рамкой) – index. Нажмите кнопку [Сохранить].
· Cохраните страницу области 1, которая выделяется прямоугольником, и в поле Имя файла введите ее имя, например Header. Нажмите [Сохранить].
· Аналогично поочередно сохраните страницы остальных областей, которые образуют фреймовую структуру, задавая файлам соответствующие имена Menu – для области 2, Main – для области 3 и Author – для области 4.
Задание 14.9.Создать web-страницы с содержанием, соответствующим пунктам меню.
Рекомендации по выполнению
· Создайте новую web-страницу командой Файл/Создать/Страница/Общие/ HTML.
· Наполните страницу информацией о своем деканате. Сохраните под именем Dekanat в папке Primer2.
· Аналогично создайте остальные страницы, соответствующие пунктам меню, и сохраните в папке Primer2 под именами: Spec, Department и т.д.
Создание гиперссылок
& Гиперссылка – объект, щелчок мыши по которому открывает другой файл или другое место в том же файле.
Гиперссылкой на web-страницах может быть текст, рисунок, баннер, кнопка.
Задание 14.10.Создать гиперссылки из навигационного меню, размещенного в области 2, на созданные web-страницы Dekanat, Spec и др.
Рекомендации по выполнению
· Выделите первый пункт меню Деканат и выполните команду Вставка/Гиперссылка.
· В открывшемся окне Вставка гиперссылки в области Связать с нажмите кнопку [файлом, web-страницей] (по умолчанию открывается текущая папка с перечнем htm-файлов), нажмите кнопку [Текущая папка],в списке файлов выберите web-страницу Деканат.
· Укажите рамку, в которой будет отображаться гиперссылка с помощью кнопки [Выбор рамки], щелкните мышью в окне Конечная рамка по рамке на выбранной странице и подтвердите выбор кнопкой [ОК]. Убедитесь, что в поле Адресуказан адрес нужного файла (имя файла). Нажмите [ОК].
· Аналогично пункт меню Специальности свяжите со страницей Spec, и все пункты навигационного меню – с соответствующими файлами.
· Сохраните изменения на странице.
· Проверьте работу гиперссылок в браузере.
Задание 14.11.Добавить в области 3 (на страницу Main) закладки начала и конца страницы.
Рекомендации по выполнению
· Создайте закладку для перехода с начала страницы на ее конец:
- установите курсор на первую строку страницы;
- выберите команду Вставка/Закладка;
- в поле Имя закладки введите Начало страницы, нажмите кнопку [ОК].
· Аналогично создайте закладку Конец страницы на последней строке страницы.
· Для проверки работы этих закладок обеспечьте, чтобы первая и последняя строки страницы не помещались на один экран.
Задание 14.12.Создать переход внутри страницы с использованием закладок.
Рекомендации по выполнению
· Установите курсор на строку страницы Main (в области 3) и наберите текст В конец страницы.
· Установите курсор на строку страницы Main и наберите текст – В начало страницы.
· Создайте гиперссылку для перехода на конец страницы:
- выделите текст В конец страницы;
- выполните команду Вставка/Гиперссылка;
- в окне Вставка гиперссылки в области Связатьс нажмите кнопку [местом в документе];
- выберите созданную ранее закладку Конец страницы и нажмите [ОК].
· Аналогично создайте гиперссылку для перехода на начало страницы.
· Проверьте работу закладок в браузере.
Задание 14.13.Добавить на страницу Dekanat кнопку для обратной навигации с этой страницы на начальную страницу сайта.
& Компонента Интерактивная кнопка позволяет осуществить переход как между страницами, так и внутри них.
Рекомендации по выполнению
· Выполните команду Вставка/Веб-компонент/Интерактивная кнопка.
· В появившемся окне Меняющиеся кнопки на вкладке Кнопка выберите произвольный образец кнопки.
· В поле Текствведите название кнопки (например, Главная).
· В поле Ссылка, используя кнопку [Обзор], укажите ссылку на web-страницу, которая отображается в области 3 (Main).
· С помощью кнопки [Выбор рамки] выберите область 3 фрейма, в котором будет отображаться страница. Нажмите [ОК].
· Сохраните web-страницу и проверьте работу интерактивной кнопки в браузере.
· Скопируйте созданную интерактивную кнопку на все остальные страницы, соответствующие пунктам меню (Spec и др.) и проверьте их работу в браузере.
Задание 14.14.Создайте на главной странице сайта ссылку на сайт университета bseu.by.
Рекомендации по выполнению
· На странице Mainв любом месте введите текст, который послужит гиперссылкой, например Загляните на сайт БГЭУ.
· Выделите текст. Выполните команду Вставка/Гиперссылки.
· В окнеВставка гиперссылки в поле Адрес введите URL-адрес сайта БГЭУhttp://www.bseu.by.
· Сохраните. Просмотрите результат в браузере.
Примечание. Аналогично можно создать ссылку на электронный почтовый ящик. Для этого нужно в окне Вставка гиперссылкивполеСвязать с использовать кнопку [Электронная почта].