Добавил:
Upload Опубликованный материал нарушает ваши авторские права? Сообщите нам.
Вуз: Предмет: Файл:
срс 1Контейнери тіла документа HTML.doc
Скачиваний:
17
Добавлен:
10.02.2016
Размер:
255.49 Кб
Скачать

Атрибут cellspacing

Атрибут СЕLLSPACING визначає ширину проміжків між комірками в пікселях. Якщо цей атрибут не зазначений, за замовчуванням задається величина, рівна двом пикселам. За допомогою атрибута СЕLLSPACING= можна розміщати текст і графіку там, де вам потрібно. Якщо ви хочете залишити порожнє місце, можна вписати в комірку пробіл.

Атрибут bgcolor

Даний атрибут дозволяє встановити колір тла. У залежності від того, з яким тегом (TABLE, TR, TD) він застосовується, колір тла може бути встановлений для всієї таблиці, для рядка або для окремої комірки. Значенням даного атрибута є RGB-код або стандартна назва кольору.

Атрибут background

Даний атрибут задає фонове зображення для таблиць. застосовується до тегів TABLE і TD. Його значенням є URL файлу з фоновим зображенням. Застосування цього атрибута розглядається нижче.

Таблиці гарні тим, що при бажанні можна зробити їхні границі невидимими. Це дозволяє за допомогою тега <ТАВLЕ> красиво розміщати на сторінці текст і графіку. Поки тег <ТАВLЕ> залишається єдиним могутнім засобом форматування в HTML. Дизайнери Web-сторінок зараз мають практично ті ж можливості у відношенні використання "порожнього простору", що й творці друкованих сторінок. Таблиці найкраще допомагають відійти від ієрархічного розміщення тексту на Web-сторінках.

3.6. HTML-форми

<вверх>

Форми були створені і використовуються в WWW для одержання відгуку користувача на подану інформацію і збору даних про користувача. Після заповнення користувачем форми і запуску процесу її обробки інформація з неї потрапляє до програми, що працює на сервері. Простота використання тега <MAILTO:> у формах дозволяє навіть власникам невеликих сторінок одержувати відгук від своїх читачів. Для обробки великої кількості відгуків використовуються програми, що підтримують Common Gateway Interface (CGI) і розташовані на сервері, на адресу якого надходять відгуки. У такий спосіб користувач може інтерактивно взаємодіяти з Web-сервером через Internet.

Завдання форми — елемент form

Елемент FORM задає документ як форму і визначає границі використання інших тегів, розташовуваних у формі. Тег <FORM> визначається послідовністю тегов <INPUT>, розміщених всередині пари <FORM> і </FORM>. У формі використовується як метод (method), так і дія (action) для опису обробки даних, що вводяться користувачем у форму. Метод (GET або POST) визначає, як повинні оброблятися вхідні дані з форми, а дія вказує на URL (Uniform Resource Identifier) програми, відповідальної за обробку цих даних.

<FORM METHOD=post  ACTION=mailto:yourname@your.email.address>

Визначення елементів керування форми — тег <INPUT>

Даний тег використовують для визначення області всередині форми, куди вводяться дані. Він формує поле для введення інформації користувачем. Це може бути текстове поле, опція, зображення або кнопка. Вигляд поля введення визначається значенням атрибута TYPE.

Атрибут TYPE=text

Коли користувачеві необхідно ввести невелику кількість тексту (одну або кілька рядків), використовується тег <INPUT>, і атрибуту TYPE присвоюється значення text. Це значення прийняте за замовчуванням і вказувати його необов'язково. Крім того, задається атрибут NAME для визначення найменування змінної поля.

Ваше ім'я <INPUT NAME=Name SIZE=35>

Існує ще три додаткових атрибути, які можна використовувати. Перший називається MAXLENGTH, він обмежує кількість символів, що вводяться користувачем у поточне поле. За замовчуванням дане число не обмежене. Другим атрибутом є SIZE, що визначає розмір видимої на екрані області, займаної поточним полем. Значення за замовчуванням визначається типом браузера. Якщо значення MAXLENGTH більше, ніж SIZE, браузер буде прокручувати дані у вікні. Останнім з додаткових атрибутів є атрибут VALUE, що забезпечує початкове значення поля введення.

Атрибут TYPE=checkbox

Для створення незалежних прапорців у формах HTML використовується тег <INPUT> з атрибутом TYPE=checkbox. У залежності від змісту форми користувач може відзначити кілька прапорців. Коли форма використовує тег <INPUT> з атрибутом CHECKBOX, у ньому повинні бути присутнім і атрибути NAME, і VALUE. Атрибут NAME вказує на найменування даного поля (прапора) введення. В атрибуті VALUE буде містити значення поля.

Україна<INPUT NAME="Країна" TYPE=checkbox VALUE=" Україна ">

Країни СНД<INPUT NAME="Країна" TYPE=checkbox VALUE="СНД">

У деяких випадках необхідно инициализировать даний прапор, як уже відзначений. У таких випадках тег <INPUT> повинний містити атрибут CHECKED.

Атрибут TYPE=radio

У деяких випадках потрібно організувати вибір одного з декількох можливих значень. Для створення форми введення при виборі користувачем одного значення з декількох можливих необхідно використовувати тег <INPUT> з атрибутом TYPE=radio. Коли у формі застосовується даний атрибут, у тезі <INPUT> повинні бути зазначені атрибути NAME і VALUE. Атрибут NAME вказує найменування відповідного поля (кнопки). Атрибут VALUE містить значення поля.

Стать чоловіча<INPUT NAME="Стать" TYPE=radio VALUE="Чоловічий">

Стать жіноча<INPUT NAME="Стать" TYPE=radio VALUE="Жіноча">

Атрибут TYPE=image

У залежності від вмісту форми може статися так, що користувачеві буде потрібно клацнути мишею на зображенні, щоб завершити роботу з формою. Для цього програмісти використовують тег <INPUT> з атрибутом TYPE=image. Коли користувач клацає мишею по зображенню, браузер зберігає координати відповідної точки екрана. Далі він "обробляє" введену у форму інформацію. Коли форма використовує атрибут image, тег <INPUT> повинен містити також атрибути NAME і SRC. NAME вказує найменування поля уведення форми. Атрибут SRC містить URL файлу — джерела зображення. Атрибут ALIGN є додатковим і використовується аналогічно тому ж атрибутові тега <IMG>.

<BR>Виберіть крапку<INPUT TYPE=image NAME=point SRC=image.gif>

Атрибут TYPE=password

Якщо у формі потрібно організувати введення пароля, то атрибут TYPE можна установити в значення password (TYPE=password). Використовуючи даний тип, можна організувати введення пароля без виведення на екран складових його символів. При цьому варто пам'ятати, що введені дані передаються по незахищених каналах зв'язку і можуть бути перехоплені.

<BR>Підпис<INPUT NAME=login>Пароль<INPUT TYPE=password NAME="Слово">

Атрибут TYPE=reset

Коли користувач заповнює форму, йому може знадобитися почати все спочатку. На такий випадок існує кнопка Reset, по якій користувач може клацнути мишею, щоб повернутися до первісних значень полів. Коли користувач вибирає дану кнопку, форма відновлює початкові значення всіх елементів, у яких є присутнім атрибут TYPE=reset. Для створення кнопки Reset використовується тег <INPUT> з атрибутом TYPE=reset. Браузер у свою чергу буде виводити зображення даної кнопки. Якщо у формі використовується атрибут reset, тег <INPUT> може додатково містити атрибут VALUE. Даний атрибут визначає напис на зображенні кнопки.

<INPUT TYPE=reset VALUE="Очистити форму">

Атрибут TYPE=submit

Використовуючи форму HTML для введення інформації від користувача, необхідно забезпечити користувачеві можливість завершити введення даних. Для цього використовується тег <INPUT> з атрибутом TYPE=submit. Браузер, у свою чергу, виводить даний елемент, як кнопку, по якій користувач може клацнути, щоб завершити процес редагування. Коли у формі використовується тег <INPUT> з атрибутом submit, даний елемент може містити два додаткових атрибути: NAME і VALUE. Атрибут NAME зберігає значення змінної поля у вашій формі. Атрибут VALUE — вказує найменування кнопки Submit.

<BR><INPUT TYPE=submit VALUE="Відправити повідомлення">

Атрибут TYPE=hidden

Приховані поля. Додавання в тег INPUT атрибута TYPE=hidden дозволить включити у форму значення, що відправляється, атрибутів NAME і VALUE, що користувач змінити не може. Такі мітки корисні при наявності декількох форм для подальшої обробки даних.

Створення багатострічкових областей введення тексту — тег <TEXTAREA>

У залежності від типу форми може знадобитися організувати введення великої кількості тексту. У таких випадках використовується тег <TEXTAREA> для створення текстового поля з декількох рядків. Даний тег використовує три атрибути: COLS, NAME і ROWS.

  • Атрибут COLSВказує (число символів) число колонок, що утримуються в текстовій області.

  • Атрибут NAME Визначає найменування поля.

  • Атрибут ROWSЗадає кількість видимих рядків текстової області.

<BR><TEXTAREA NAME=тема COLS=38 ROWS=3></TEXTAREA>

   

Використання списків у формі — тег <SELECT>

Коли форми HTML стають більш складними, в них часто включають списки з прокручуванням і випадне меню. Для цього використовують тег SELECT з атрибутом TYPE=select. Для визначення списку пунктів використовують тег <OPTION>. Тег <SELECT> підтримує три необов'язкових атрибути: MULTIPLE, NAME і SIZE.

  • Атрибут MULTIPLEДозволяє вибрати більш ніж одне найменування.

  • Атрибут NAMEВизначає найменування об'єкта.

  • Атрибут SIZEВизначає число видимих користувачеві пунктів списку. Якщо у формі встановлене значення атрибута SIZE=1, то браузер виводить на екран список у виді випадаючого меню. У випадку SIZE > 1 браузер представляє на екрані звичайний список.

У формі може використовуватися тег <OPTION> тільки всередині тега <SELECT>. Ці теги підтримують два додаткових атрибути: SELECTED і VALUE.

  • Атрибут SELECTEDВикористовується для первісного вибору значення елемента за замовчуванням.

  • Атрибут VALUEУказує на значення, що повертається формою після вибору користувачем даного пункту. За замовчуванням значення полючи дорівнює значенню тега <OPTION>

<BR>Вибір

<SELECT NAME="Вибір">

<OPTION>Варіант 1

<OPTION>Варіант 2

<OPTION VALUE="Варіант 3">Варіант 3

<OPTION SELECTED>Варіант 4

</SELECT>