Глава 13 Использование таблиц в оформлении Web

Размещение горизонтальных линий

В двух предыдущих главах мы рассмотрели вопросы, связанные с размещением на Web-странице текстовой информации и ее оформлением с использованием абзацев, списков, таблиц. Для оформления Web-узла можно также применять обычные и графические горизонтальные линии. Дата, размещенная на странице, позволит просмотреть дату последнего обновления Web-узла.

Из этой главы вы также узнаете, что такое общие области и как их использовать при создании нижнего колонтитула Web-страницы.

Вид, который имеет разрабатываемая вами Web-страница в режиме редактирования программы FrontPage, может отличаться от того, как она будет выглядеть при просмотре в обозревателе. Для контроля получаемых результатов работы необходимо периодически просматривать Web-странипу и обозревателе, чтобы вовремя устранить те или иные возникающие нюансы. Как просмотреть Web-страницу с помощью обозревателей, установленных на вашем компьютере, не выходя из программы FrontPage, мы также рассмотрим в этой главе.

Для выделения заголовков, разделов текста и просто для оформлении Web-страниц можно использовать горизонтальные линии. Чтобы разместить гризонтальную линию на Web-странице, выполните следующие действия:

1. Установите курсор в то место страницы, где хотите расположить горизонтальную линию.

2. В меню Вставка (Insert) выберите команду Горизонтальная линия(Horizontal Line ).

3. Для настройки свойств размешенной на странице линии выделите ее и выполните одно из следующих действий:

Нажмите комбинацию клавиш <Alt>+<Enter>

Нажмите правую кнопку мыши и выберите из контекстного мепк. команду Свойства горизонтальной линии (Horizontal Line Properties

4. На экране открывается диалоговое окно Свойства горизонтальной линии (рис. 14.1), в котором можно настроить следующие параметры линии:

Ширина (Width) — длина линии в пикселах или в процентах от ширины окна обозревателя. Единицы измерения задаются с помощью опций Проценты от ширины окна (Percent of windows) и Точки (Pixels), расположенных рядом с полем

Высота (Height) — толщина линии в пикселах

Выравнивание (Alignment) — выравнивание линии по левому краю страницы, по центру или по правому краю с помощью опций Слева (Left), По центру (Center) или Справа (Right), соответственно.

Цвет (Color) — цвет линии

Сплошная линия (без заливки) (Solid line (no shading)) — установка данного флажка при выборе из списка Цвет (Color) значения Авто (Automatic) позволяет придать линии эффект объемности за счет ее оттенения цветом фона страницы

Рис. 14.1. Диалоговое окно Свойства горизонтальной линии

Замечание

Линия, размещенная на Web-странице, имеет по умолчанию параметры, которые были заданы при создании предыдущей линии.

Совет

Для удаления линии, размещенной на Web-странице, можно использовать команду Удалить (Delete) меню Правка (Edit) или клавиши <Delete> и <Spacebar>.

Для размещения линий на Web-странице можно использовать не только команду Горизонтальная линия (Horizontal Line) меню Вставка (Insert). Вы можете украсить создаваемые страницы графическими линиями, являющимися графическими объектами и входящими в библиотеку Clip Art. Чтобы это сделать:

1. Установите курсор в то место страницы, где хотите расположить графическую горизонтальную линию.
2. В меню Вставка (Insert) выберите команду Рисунок (Picture), затем из появившегося подменю — опцию Картинки (Clip Art). На экране появляется панель Вставка картинки (Insert Clip Art).

Рис. 14.2. Панель Вставка картинки в окне программы FrontPage

3. Выберите на панели ссылку Коллекция картинок (Media Gallery). Откроется диалоговое окно Коллекция картинок (Microsoft). Панель Список коллекций (Collection List) этого окна содержит два больших раздела: Мои коллекции и Веб-коллекции. В первом разделе содержатся все папки вашего компьютера, содержащие медиафайлы, во втором — коллекция картинок библиотеки ClipArt.

4. Используя панель Список коллекций (Collection List) этого диалогового окна, найдите изображения графических линий. При установлении курсора на рисунок появляется всплывающая подсказка, указывающая размер графического объекта, объем файла в килобайтах и его тип (рис. 14.3).

Рис. 14.3. Диалоговое окно Коллекция картинок

5. Щелкните мышью на кнопке со стрелкой понравившейся вам линии. Появляется меню.

6. Выберите в меню команду Копировать (Сору). Графическая линия помещается в буфер обмена Windows.

Замечание

Кнопка Просмотр и свойства (Preview/Properties) меню открывает окно просмотра, в котором можно просмотреть выбранную линию в увеличенном масштабе. Для закрытия окна просмотра нажмите кнопку Закрыть (Close).

7. Перейдите в окно программы FrontPage и вставьте линию из буфера обмена на Web-страницу, воспользовавшись любым удобным для вас способом. Например, нажмите комбинацию клавиш <Shift>+<Ins>.

8. При сохранении Web-страницы с размещенной в ней графической линией на экране появляется диалоговое окно Сохранение внедренных файлов (Save Embedded Files) (рис. 14.4), предлагающее сохранить используемое графическое изображение линии в одной из папок Web-узла.

В нижней части окна под списком графических файлов расположены три кнопки, имеющие следующее назначение:

• Переименовать (Rename) — выделяет имя файла, на котором установлен курсор, для его переименования.

Рис. 14.4. Диалоговое окно Сохранение внедренных файлов

Рис. 14.5. Web-страница с размещенными горизонтальными линиями

Сменить папку (Change Folder) — открывает диалоговое окно Смена папки (Change Folder), содержащее папки открытого Web-узла. Выберите в этом окне папку, в которой хотите сохранить графический файл, и нажмите кнопку ОК. Имя этой папки будет размещено в столбце Папка (Folder) диалогового окна Сохранение внедренных файлов.

Действие (Set Action) — открывает диалоговое окно Задание действия (Set Action), в котором вы можете отказаться от сохранения графического файла, выбрав вторую из двух расположенных в окне опции. При этом в столбце Действие диалогового окна Сохранение внедренных файлов устанавливается значение Не сохранять (Don't Save).

Присвойте графическому файлу имя, которое будет ассоциироваться с размещенным объектом, укажите требуемую папку и нажмите кнопку ОК.

На рис. 14.5 представлена Web-страница, на которой находятся разделительные линии обоих типов. Линия, расположенная под заголовком страницы, размещена с помощью команды Горизонтальная линия меню Вставка. Линия, размещенная в нижней части страницы, является графическим объектом.