|
На заметку |
Установите на своем сайте нашу кнопку: |
|
Графическая кнопка
Графическая кнопка — это обычное графическое изображение, "по совместительству" выполняющее функцию кнопки отправки данных, т. е. при щелчке по такому изображению данные, введенные в форму, будут отправлены серверной программе.
Для помещения графической кнопки в форму используется кнопка Image Field панели объектов или пункт Image Field подменю Form Ob jects меню Insert . После этого на экране появится диалоговое окно Select File , в котором вы должны будете выбрать файл графического изображения. После нажатия кнопки открытия графическая кнопка будет создана. В поле ввода ImageField вводится уникальное имя элемента управления. Dreamweaver автоматически подставит туда сгенерированное им самим имя, но вам сразу же следует его изменить. Вы также можете выбрать пункт Name в контекстном меню графической кнопки и изменить это имя в появившемся на экране диалоговом окне Change Attribute .
Графическая кнопка отправляет серверной программе целых две пары значений вида:
<Имя графической кнопки>.х=Х
<Имя графической кнопки>.у=У
где х и y — координаты точки на графической кнопке, на которой пользователь щелкнул мышью.
В полях ввода W и Н вводятся, соответственно, ширина и высота графической кнопки в пикселах. Dreamweaver сам рассчитывает эти величины и помещает их в названные поля. Если вы хотите уменьшить или увеличить графическую кнопку, измените их вручную. Маркеров изменения размеров Dreamweaver в этом случае почемуто не предусматривает.
В поле ввода Src задается имя файла графического изображения. Вы также можете щелкнуть значок папки, расположенный справа от поля ввода, и выбрать нужный файл в диалоговом окне Select File . Вызвать это окно вы можете, выбрав пункт Source File в контекстном меню графической кнопки.
В поле ввода Alt задается "альтернативный" текст, отображаемый вместо графической кнопки, если она еще не загружена, или если пользователь запретил загрузку графических изображений в настройках Web -обозревателя. Вы также можете выбрать в контекстном меню графической кнопки пункт Alt Text и задать этот текст в появившемся на экране диалоговом окне Change Attribute .
Раскрывающийся список Align задает, каким образом графическая кнопка будет выравниваться относительно окружающего ее содержимого страницы. Здесь доступны следующие пункты:
Тор — верх кнопки выравнивается по верхнему краю окружающего текста;
Middle -середина кнопки выравнивается посередине окружающего текста;
Bottom — низ кнопки выравнивается по нижнему краю окружающего текста;
Left — кнопка прижимается к левому краю страницы. Все остальное содержимое страницы обтекает кнопку;
Right — кнопка прижимается к правому краю страницы;
Browser Default — выравнивание по умолчанию, как правило, аналогично Bottom .
Вообщето, чтобы получить нужный результат, вам придется поэкспериментировать с различными значениями этого параметра.
Кнопка Edit Image позволит вам запустить программу графического редактора для того, чтобы отредактировать изображение. При этом будет запущена программа, зарегистрированная для данного типа графических файлов по умолчанию. Вы также можете выбрать пункт Edit With <название программы> контекстного меню графической кнопки.
Примечание
Графическая кнопка создается с помощью одинарного тега < input type = " image ">.
Скрытое ( невидимое ) поле
Скрытое поле — это особый элемент управления, вообще не отображающийся в Web -странице. Значение, изначально присвоенное скрытому полю, не может быть изменено посетителем сайта. Можете считать, что это своего рода "тайные" данные, "спрятанные" в форме и недоступные посетителю.
Скрытое поле обычно используется в формах, генерируемых серверными программами. В частности, если покупатель электронного магазина щелкает по некому товару, серверная программа выдаст ему форму оформления заказа, в которую с помощью скрытого поля "внедрено" имя этого покупателя. После того как другая серверная программа получит данные о заказе, она может сразу же выяснить, кем заказан товар. В статических же страницах полезность скрытого поля весьма сомнительна.
Для помещения в форму скрытого поля используется кнопка Hidden Field панели объектов или пункт Hidden Field подменю Form Objects меню Insert .
В поле ввода HiddenField вводится уникальное имя элемента управления. Dreamweaver автоматически подставит туда сгенерированное им самим имя, но вам сразу же следует его изменить. Вы также можете выбрать пункт Name в контекстном меню скрытого поля и изменить это имя в появившемся на экране диалоговом окне Change Attribute .
В поле ввода Value задается значение, которое будет отправлено скрытым полем серверной программе. Вы также можете выбрать пункт Value в контекстном меню скрытого поля и задать значение в появившемся на экране диалоговом окне Change Attribute .
Примечание Скрытое поле создается с помощью одинарного тега
< input TYPE =" hidden ">.
Дополнительные элементы управления
Дополнительные элементы управления служат не для ввода данных, а для удобства посетителя страницы. Они поддерживаются только достаточно новыми программами Web -обозревателей, а именно Internet Explorer , начиная с версии 5.0, Navigator , начиная с версии 6.0, и всеми версиями Opera и Mozilla .
Метка
Метка — это просто текстовая подпись, добавляемая к обычному элементу управления, например, полю ввода или переключателю.
Чтобы привязать метку к элементу управления, выделите его и нажмите кнопку Label панели объектов или выберите пункт Label подменю Form Objects меню Insert . После этого Dreamweaver переключится в режим отображения содержимого страницы и ее HTML -кода, и в окне документа вы увидите такой код:
< LABEL > ...Код элемента управления... </ LABEL >
Как видите, метка создается с помощью парного тега < label >. HTML -код элемента управления, к которому привязывается метка, находится внутри этого тега. Текст же метки вводится также внутрь этого тега, перед кодом элемента управления или после него. В первом случае текст метки появится перед элементом управления, а во втором — после него.
Например, следующий код поместит на Web -странице метку и - после нее — поле ввода:
<LABEL> Поле ввода <INPUT TYPE="text" NAME="textfield"></LABEL>
А этот код поместит поле ввода ниже метки:
< LABEL > Поле ввода <BR> < INPUT TYPE ="text" NAME=" textfield "></LABEL>
Можете проверить — оба этих фрагмента кода действительно работают.
Группа
Группа элементов управления — это простой прямоугольник, объединяющий несколько элементов управления и имеющий текстовую метку.
Чтобы объединить несколько элементов управления в группу, выделите их и нажмите кнопку Fieldset панели объектов или выберите пункт Fieldset подменю Form Objects меню Insert . После этого Dreamweaver переключится в режим отображения содержимого страницы и ее HTML -кода и выведет небольшое диалоговое окно Fieldset . Введите в единственное поле ввода этого окна текст метки и нажмите кнопку ОК. Диалоговое окно Fieldset После этого вы увидите такой код в окне документа:
<FIELDSET>
<LEGEND>Te кст метки </LEGEND>
... Коды элементов управления ...
</ FIELDSET >
Да, группа создается с помощью парного тега < fieldset >, внутри которого помещается HTML -код всех входящих в группу элементов управления. Текст метки помещается внутри особого парного тега < legend >, находящегося внутри тега < fieldset >. В зависимости от места, где находится тег < legend >, метка будет помещена вверху или внизу группы.
Внимание!
Элементы управления , помещенные в группу , должны быть окружены тонким прямоугольником . Но Dreamweaver не отображает этот прямоугольник . Чтобы увидеть его , откройте страницу в Web - обозревателе .
|