Официальный сайт ДРАКОНа
DRAGONnoid

переход в другие разделы

Основы пользования DREAMWEAVER

И так давайте начнём наше обучение по DreamWeaver 4 / MX.

Первые шаги. Обзор интерфейса и настройка к работе.

Для наччала запустите саму программу ;-)
И так в краце поясняю: DreaWeaver хорошь тем, что в нём помимо огроменного числа функций есть функция двойного интерфейса. Другими словами общее окно программы делится на два, верхнее - это програмный код создаваемых страниц HTML, а нижний - визуальный вид этих же страниц (т.е. почти готовый вид странички). Это очень удобно для быстрого и профиссионального создания сайтов.
Чтобы настроить такой вид, нужно найти вверху возле слова FILE такую комбинацию кнопок:

Самая первая показывает чисто програмный код страницы, третья - визуальное создание страниц, и та что между ними и есть то что нам нужно.

Примечание: Если вы не можете найти их, значит они по какой-то причине отключены, чтобы включить нужный вид с помощью меню а не кнопок - зайдите в View (Вид) \ Code and Design (Код и Дизайн). А чтобы включить сами эти кнопки - попробуйте нажать Ctrl+Shift+T.

Теперь нам важно, чтобы были так же включены окна Insert (Обьекты) и Properties (Свойства). Они включаются через Window (Окна) \ Insert (Обьекты) и Window (Окна) \ Properties (Свойства).

Описание окна Insert (Обьекты) и значение его элементов:

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

Работа с текстом в DreamWeaver 4 / MX.

Описание окна Window (Окна) \ Properties (Свойства) и значение его элементов:

Для каждых элементов, окно Properties выглядит по разному. Например кгда вы пишите текст или выделяете ячейки таблицы, окно свойств выглядит так:


  • Format - слово само за себя говорит что это формат текста (обычно заголовки по умолчанию. если вы заголовки пишете следующими форматами, то текст у вас выглядит соответственно тому что расположено ниже:
    • None

    • Heading 1

    • Heading 2

    • Heading 3

    • Heading 4

    • Heading 5
    • Heading 6
    • Prefomattet - Это тег предложения. Т.е. вы пишите текст и при переносе он не будет переходить через строчку вниз.
  • Правее слова Format расположенно окно выбора шрифта, рядом с буквой А.
  • Правее Size - выбор размера текста, где 1- это самый маленький, 2- больше, 3- ещё больше и т.д. (советую использовать 2- для стандартного текста и 3- для заголовков).
  • Ниже слово Link, позволяет делать ссылки. Чтобы сделать ссылку - выделите нужный фрагмент текста и напишите открываемый файл врчную или укажите через обозреватель.
  • Horz - расположение текста относительно страницы (ячейки, таблицы) по горизонтали.
  • W - размер ячейки по ширине (задаётся в пикселях или в процентах если после числа стоит %).
  • Vert - расположение текста относительно страницы (ячейки, таблицы) по вертикали.
  • H - размер ячейки по высоте (задаётся в пикселях или в процентах если после числа стоит %).
  • Bg (верхний) - позволяет вставить фоновый рисунок в ячейку.
  • Bg (нижний) - позволяет вставить фоновый цвет в ячейку.
  • Brdr - позволяет задать цвет рамки.
  • стандартный вордовский набор работы с текстом, думаю пояснения что за что отвечает тут ненужны.

Работа с таблицами в DreamWeaver 4 / MX.

Для того, чтбы вставить текст - вспоминаем в окне Insert кнопочку при нанажатии на которую появляется следующее окно:

  • Rows - колличество строк.
  • Columns - колличество колоннок.
  • Width - ширина таблицы в Pixels (пикселях - точках) или Percent (процентах от максимально возможно заполняемого пространстав (не обязательно например 50% от длинны страницы - если таблица расположенна внутри ячейки то таблица займёт 50% от ширины ячейки).
  • Border - тольщина рамки. Т.е. толщина внутренней части.
  • Cell Padding - отступ от краёв таблицы. число 0 - соответственно полное примыкание к таблице.
  • Cell Spacing - толщина краёв таблицы.

После того как вы введёте данные и нажмёте ОК - появится примерно такая таблица на графическом экране:

Если её выделить, то в окне свойств можно её редактировать - заливать рисунками, выравнивать текст и т.д.

Нажав правой клавишей в область можно добавить колонки или строки в данную таблицу или разбить имеющиеся ячейки на строки или столбцы:

  • Insert Row - вставляет строку.
  • Insert Column - вставляет колонку.
  • Split Cell... - разбивает данную ячейку на заданное колличество строк или колонок.
  • Merge Cells - появляется при выделении нескольких ячеек. Эта функция позволяет обьединить ячейки в одну.

Создание анимированных кнопок.

Способ первый (самый просто).

Жмём на кнопку из окна Insert и появляется следующее окно:

  • Image Name - имя рисунка (обязательно задавать латинскими буквами).
  • Original Image - первый внешний вид рисунка (задаётся через броузер или вручную).
  • Rollover Image - рисунок при навидении мыши.
  • Alternate Text - текст подсказки появляемый при наведении мыши.
  • When Clicked, Go To URL - говорит само за себя : при нажатии на какую ссылку идти.

Пока всё! продолжение следует :-)
Все вопросы задавайте мне на мыло dragonnoid@yandex.ru

 

Главное меню
Hosted by uCoz


Hosted by uCoz