Работа в Microsoft FrontPage XP

Добавление линии, фигуры или рисунка


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

В программу FrontPage 2002 включены улучшенные инструменты рисования, которые упрощают включение форматированных специальным образом линий, разнообразных готовых фигур, объектов WordArt, текстовых блоков и теней с помощью тех же методов, что используются в Microsoft Word и Microsoft PowerPoint. Эти линии, фигуры и рисунки известны под общим названием Рисунки Office (Office Drawings). Рисунки Office можно копировать из одних приложений Office и затем выполнять их вставку непосредственно в сайт, созданный с помощью FrontPage.

Команды, используемые для работы с большинством изображений, представлены в виде кнопок в панели инструментов Рисование (Drawing) и панели инструментов Холст (Drawing Canvas). Обе эти панели инструментов можно открывать в любой момент, щелкнув правой кнопкой на любой панели инструментов и затем щелкнув на их именах в контекстном меню панелей инструментов. Панель рисования открывается автоматически, когда у вас выделяется рисунок Office для редактирования. Она содержит следующие кнопки:


  • Используйте команды меню Действия (Draw), чтобы управлять группированием, позиционированием и перемещением объектов.
  • Щелкните на кнопке Автофигуры (AutoShapes), чтобы вывести на экран меню из более чем 130 фигур, начиная с простых геометрических форм и стрелок и заканчивая полностью сформированными указателями погоды. Сюда же входят изображения блок-схемы, баннер и символы выноски. Вы можете извлекать меню Автофигуры (AutoShapes) из панели рисовани с помощью перетаскивания, чтобы оно действовало как отдельная плавающая панель инструментов.
  • Используйте кнопки Линия (Line), Стрелка (Arrow), Прямоугольник (Rectangle) и Овал (Oval), чтобы рисовать эти простые фигуры при любом размере путем щелчка и последующего протягивания на странице.
  • Щелкните на кнопке Надпись (Text Box) для вставки текстовых блоков внутри изображений.
  • Используйте кнопки Добавить объект WordArt (Insert WordArt), Добавить картинку (Insert Clip Art) и Добавить рисунок из файла (Insert Picture From File) для вставки новых графических элементов.
  • Используйте кнопки Цвет заливки (Fill Color), Цвет линии (Line Color) и Цвет текста (Font Color) для управления цветами соответствующих элементов.
  • Используйте кнопки Тип линии (Line Style), Тип штриха (Dash Style) и Вид стрелки (Arrow Style) для форматирования толщины, цвета и концевых элементов таких линий.
  • Кнопка Стиль тени (Shadow Style) используется для применения теней к графическим элементам и модифицирования свойств теней.
  • Используйте кнопку Объем (3-D Style), чтобы придать графическим элементам трехмерный вид.




Вы можете группировка несколько рисунков вместе, чтобы их можно было обрабатывать как один объект. Таким способом можно создать один рисунок из нескольких фигур и затем выполнять копирование и вставку этого рисунка, а также его сжатие или увеличение. Если вам нужно снова работать с элементами этого рисунка по отдельности, вы можете разгруппировать их в любой момент.

"Рамка", в которой создаются рисунки Office при работе с FrontPage, называется "полотном" для рисунка. Вы можете сделать так, чтобы холст рисунка действовал как реальная рамка, путем его форматирования с видимыми границами и цветами фона; но его основное назначение - это содержать все элементы рисунка, который вы создаете, чтобы соответствующий HTML-код для этого рисунка можно было выделять и обрабатывать как один блок. Форматирование холстов рисунков также определяет способ, посредством которого текст обтекает вокруг рисунка, и позицию рисунка относительно других объектов страницы.

Панель инструментов Полотно (Drawing Canvas) появляется при вставке нового рисунка.



Она содержит следующие кнопки:

  • Щелкните на кнопке Подобрать размер(Fit Drawing to Contents), чтобы увеличить или уменьшить холст до размеров рисунка, который он содержит.
  • Щелкните на кнопке Увеличить (Expand Drawing), чтобы увеличить рисунок до текущего размера холста.
  • Щелкните на кнопке Изменение масштаба рисунка (Scale Drawing), чтобы увеличить рисунок до текущего размера холста, но поддерживая при этом исходное отношение высоты к ширине.


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

Для этого упражнения не требуется никакой рабочей папки.

Выполните следующие шаги.

  1. В стандартной панели инструментов щелкните на кнопке Создание новой обычной страницы (Create a new normal page)
    , чтобы создать новую страницу.
  2. В меню Вставка (Insert) выберите пункт Горизонтальная линия (Horizontal Line), чтобы нарисовать линию.
  3. Щелкните правой кнопкой на этой линии и затем в контекстном меню выберите пункт Свойства горизонтальной линии (Horizontal Line Properties), чтобы вызвать на экран следующее диалоговое окно.





  4. В диалоговом окне Свойства горизонтальной линии (Horizontal Line Properties) выполните следующее:
  5. Задайте в поле Ширина (Width) значение 80 и выберите вариант В процентах от ширины окна (Percent of window).
  6. Задайте в поле Высота (Height) значение 3 пиксела.
  1. В раскрывающемся списке Цвет (Color) выберите зеленый цвет. Щелкните на кнопке OK, чтобы закрыть диалоговое окно и применить свои изменения. Совет. Перемещайте курсор мыши поверх цветов в раскрывающемся списке цветов, чтобы увидеть название каждого цвета, отображаемое как всплывающая подсказка. Страница будет выглядеть следующим образом.


    увеличить изображение

  2. Теперь нажмите клавиши (Ctrl)+(End), чтобы переместить точку ввода в конец страницы.
  3. В меню Вставка (Insert) укажите пункт Рисунок (Picture) и затем выберите пункт Создать рисунок (New Drawing). FrontPage выведет на экран пустой холст, панель инструментов Полотно (Drawing Canvas) и панель инструментов Рисование (Drawing) как показано ниже.


    увеличить изображение

    Совет. Вы можете перетаскивать панели инструментов в сторону во время своей работы.
  4. В панели инструментов рисование щелкните на кнопке Автофигуры (AutoShapes), чтобы увидеть меню имеющихся фигур. Совет. Раскрывающееся меню с маркерами на нем (горизонтальными линиями в затененной полосе) можно перетаскивать в рабочую область, и оно "плавает" в этой области (как панель инструментов), пока вы не щелкнете на кнопке Закрыть (Close) соответствующей панели инструментов. Вы можете также перетаскивать это меню на панель инструментов или закреплять его на левом, правом или нижнем крае окна.
  5. Укажите пункт Звезды и ленты (Stars and Banners) и затем щелкните на символе Пятно 2 (Explosion 2), как показано ниже.



    Совет. Поместите курсор мыши поверх символа, чтобы увидеть название символа, отображаемое как всплывающая подсказка.
  6. Протяните курсор мыши с верхнего правого угла холста, чтобы создать небольшую фигуру в форме "взрыва", как это показано ниже.


    увеличить изображение

    Эта фигура станет головкой цветка.
  7. Используйте в меню автофигур команду Блок-схема (Flow-chart) фигуры Знак завершения (Terminator) и Решение (Decision), чтобы использовать их в качестве стебля и листьев цветка, как это показано ниже.




    увеличить изображение

    Для поворота выделенного объекта протяните и поверните по окружности его маркер
  1. Для поворота листьев на подходящие углы щелкайте на каждом из них и поворачивайте его маркер вращения (зеленая точка) для перемещения в указанную ниже позицию.


    увеличить изображение

  2. Щелкните правой кнопкой на изображении взрыва (головки цветка), в контекстном меню укажите на пункт Порядок (Order) и затем выберите пункт На передний план (Bring to Front). Головка цветка теперь окажется поверх стебля. В зависимости от степени перекрытия стебля и головки цветка это переупорядочивание может оказаться незаметным для глаза.
  3. Используйте подходящие фигуры, чтобы создать обстановку сада, как это показано ниже.


    увеличить изображение

  4. Щелкните на головке цветка, чтобы выделить ее, и, удерживая клавишу (Shift), щелкните на каждом элементе цветка, чтобы выделить эти элементы, как это показано ниже.


    увеличить изображение

  5. Щелкните правой кнопкой на выделенных элементах и в контекстном меню укажите пункт Группировка (Grouping), затем выберите пункт Группировать (Group). Элементы цветка будут сгруппированы в один элемент, чтобы вы могли работать с цветком как с одним объектом.
  6. Используя кнопки стандартной панели инструментов Копировать (Copy)
    и Вставить (Paste)
    или комбинации клавиш (Ctrl)+(C) (для копирования) и (Ctrl)+(V) (для вставки), вставьте несколько копий цветка, чтобы создать целое поле цветов.
  7. Используйте маркеры изменения размеров на изображениях цветков, чтобы они отличались по размерам.
  8. Щелкните правой кнопкой на каждом цветке, укажите в контекстном меню пункт Группировка (Grouping) и затем выберите пункт Разгруппировать (Ungroup), чтобы отделить элементы друг от друга для их окрашивания по отдельности.
  9. Щелкните правой кнопкой на изображении солнца и в контекстном меню выберите пункт Форматировать автофигуру (Format AutoShape), чтобы появилось следующее диалоговое окно.



  10. В диалоговом окне Формат автофигуры (Format AutoShape) выполните следующее:
    • Во вкладке Цвета и линии (Colors and Lines) задайте в меню Цвет (Color) секции Заливка (Fill) желтый цвет.
    • Во вкладке Layout (Положение) в секции Обтекание (Wrapping style) выберите вариант Нет (None) и в секции Положение (Positioning style) выберите вариант Абсолютное (Absolute).
    • Щелкните на кнопке OK, чтобы закрыть диалоговое окно и применить заданные настройки.


  11. Окрасьте цветки, используя ваши любимые цвета, чтобы создать впечатление привлекательного сада, как это показано ниже.


    увеличить изображение

  12. По окончании закройте панель инструментов рисования.
  13. Щелкните на кнопке Закрыть (Close) этой страницы, чтобы закрыть текущий файл; если хотите, сохраните эту работу, когда получите запрос сохранения.



Содержание раздела