Файл: Лекція 6 Форми.doc

Кнопка із зображенням

Кнопки із зображеннями аналогічні по дії кнопці Submit, але є малюнком.  Використовуваний type=image

<form action="/cgi-bin/handler.cgi"> <table align=center> <tr><td colspan=2>Введіть ваше ім'я: <tr> <td><input type=text width=25></td> <td><input type=image src=’smile3.jpg’ width=90 height=68 border=0></td> </tr> </table> </form>

На сторінці побачимо наступне: 

Картинка задається за допомогою тега scr і адрес картинки.

src=’smile3.jpg’

Таким чином, комбінуючи різні способи створення форм, ми можемо на одній сторінці розмістити декілька форм відразу. Для відокремлення одного виду форми від іншого використовуватимемо тег <fieldset>

Приклад комбінованої форми

Приклад використання різних форм на одній сторіночці Заповните, будь ласка, цю форму Вашими даними і натисніть кнопку "Відправити дані"! Ви зможете побачити варіант обробки Ваших даних.

Ця форма має наступний код:

<form method="post" action="8.php"> <fieldset> <b>Зaполните Ваші дані:</b>

<br><br> Ім'я: <input type=text name="name" maxlength=25 size=20 value=" "> <br><br> </fieldset> <p> <fieldset> <b>Виберіть улюблений колір:</b><br> <p align=center> <input type=radio name=answer value="#F4F090">Жовтий<br> <Input type=radio name=answer value="#80ECF3">Блакитний<br> <input type=radio name=answer value="#F3ACC5">Рожевий<br> <Input type=radio name=answer value="#A7F4AB">Зелений<br> </select>  <br><br> </fieldset> <p> <fieldset> <b>Напишіть тут текст </b><br> <textarea name="basictext" rows=7 cols=45 ></textarea> </fieldset> <p> <fieldset> <input type=reset value="Сбросить данные"> <Input type="submit" value="Отправить данные"> </fieldset> </form> 

Контрольні запитання

1. Що таке форма?

2. Який тег описує форму у HTML коді?

3. Які атрибути є обов’язковими при додаванні форми?

4. Назвіть елементи форми.

5. Який атибут допомагає створити кнопку із зображенням?

10