Macromedia Dreamweaver - Фоновые изображения

ПРАКТИЧЕСКАЯ РАБОТА №21


Цель работы:  Научиться  задавать фоновые изображения в Macromedia Dreamweaver. 

Задачи работы:                                


  1. Овладеть методикой работы с графическими файлами в программе Macromedia Dreamweaver.
  2. Получить навыки работы с пунктом Page Properties меню Modify
  1. Установке параметров текста документа на основе "образца";


Обеспечивающие средства: Сборник  описаний  практических работ; операционная система  Windows XP, программа Internet Explorer; программа Macromedia Dreamweaver; персональный компьютер.

Требования к отчету:  Итоги  практической работы  представить в виде файла lab21.html на диске

 

Технология работы:


1. Запустить программу Macromedia Dreamweaver.

2. Загрузите файл  lab19.html.

3. Создайте свой графический файл  и  примените его как  фоновое изображение.


Для этого  вызовите на экран диалоговое окно Page Properties, для чего выберите пункт Page Properties меню Modify или контекстного меню или нажмите клавиши <Ctrl>+<J>. В поле ввода Background Image введите имя файла фонового изображения или нажмите кнопку Browse и выберите нужный файл в диалоговом окне и  ОК



4. Оформите заголовок «Какой софт нужен начинающему веб-мастеру» в рамку.


перечислим параметры заголовка:


  • текст, который мы поместим в рамку (пусть это будет заголовок«Какой софт нужен…»);
  • расстояние между рамкой и помещенным в ней текстом (4 пиксела);
  • толщина рамки (8 пикселов);
  • цвет рамки (темно-синий);
  • размеры рамки (ширина — 400%, высота — 50 пикселов).


 Таблицу создадим  через вкладку Common  далее  вкладка Insert, затем Table  панели объектов. Параметр Cell Padding должен быть равен 8 пикселам, a Cell Spacing — нулю. Таблица должна содержать одну строку и один столбец. Видно, что рамка разделена на две половины: светлую и темную. Внешняя таблица имеет невидимую границу (ее толщина равна нулю), темно-синий цвет фона и параметр Cell Padding, равный толщине рамки, которую нам необходимо получить. Внешняя таблица имеет белый фон (это обязательно, т. к. содержимое вложенной таблицы "унаследует" фон от внешней), невидимую границу и параметр Cell Padding, равный нужному нам промежутку между рамкой и текстом. Создадим таблицу шириной 400% и высотой 50 пикселов, с темно-синим фоном и толщиной рамки, равной нулю. Параметр Cell Padding должен быть равен 8 пикселам, a Cell Spacing — нулю. Эта таблица должна содержать одну строку и один столбец:


  • текст, который мы поместим в рамку,  - " Какой софт нужен начинающему веб-мастеру ";
  • расстояние между рамкой и помещенным в нее текстом — 4 пиксела;
  • толщина рамки — 40 пикселов;
  • цвет рамки совпадает с общим тоном фонового изображения (в нашем случае светло-серый);
  • фоновое изображение — файл Wb02049_.gif, поставляемый в комплекте Microsoft Office 2000;
  • размеры рамки: ширина — 400%, высота не определена и устанавливается автоматически


Графическая рамка для текста создается точно так же, как и цветная. За тем исключением, что для внешней таблицы мы зададим графический фон.


Создадим внешнюю таблицу с шириной 100%, светло-серым фоном и толщиной рамки, равной нулю. Значение параметра Cell Padding устанавливаем 40 пикселов, а параметр Cell Spacing — ноль. Эта таблица должна содержать одну строку и один столбец. В качестве фонового изображения задаем подобранный файл. Теперь помещаем текстовый курсор в единственную ячейку этой таблицы и вставляем в нее вторую таблицу, также состоящую из одной строки и одного столбца. Ее ширина и высота должны быть равны 100% (чтобы заполнить всю ячейку), толщина границы и параметр Cell Spacing — 0, параметр Cell Padding — 4 пиксела. Не забудьте задать для нее белый фон.


5. Создайте таблицу для фразы  «Что нужно настоящему веб-матеру для полноценной работы?»
 Эта таблица должна содержать одну строку и один столбец:


  • расстояние между рамкой и помещенным в нее текстом — 10 пиксела;
  • толщина рамки — 60 пикселов;
  • цвет рамки  оливковый;
  • фоновое изображение должно сочетаться с цветом рамки;
  • размеры рамки: ширина — 600%, высота не определена и устанавливается автоматически


6. Сохранить файл как lab21.txt в блокноте и как lab21.html для просмотра в браузере

  .