2.4 Таблиці

Для опису таблиць використовується тег <ТАВLЕ>. Тег <ТR> (Таble Row, рядок таблиці) створює рядок таблиці. Весь текст, інші теги і атрибути, які потрібно помістити в один рядок, повинні розміщуватися між тегами <ТR></ТR>. Усередині рядка таблиці зазвичай розміщуються комірки з даними. Кожна комірка, що містить текст або зображення, повинна бути укладена в теги <ТD></ТD>. Кількість тегів <ТD></ТD> в рядку визначає кількість комірок.

Заголовки стовпців таблиці – тег <ТН>. Заголовки для стовпців і рядків таблиці задаються за допомогою тега заголовка <ТН> </ ТН> (Таblе Неаder, заголовок таблиці). Ці теги подібні <ТD> </ ТD>. Відмінність полягає в тому, що текст, укладений між тегами <ТН> </ ТН>, автоматично записується жирним шрифтом і за замовчуванням розташовується посередині комірки. Центрування можна скасувати і вирівняти текст по лівому або правому краю. Якщо скористатися <ТD> </ ТD> з тегом <В> і атрибутом <АLIGN = center>, текст теж буде виглядати як заголовок. Однак слід мати на увазі, що не всі браузери підтримують в таблицях жирний шрифт, тому краще ставити заголовки таблиць за допомогою <ТН>.

Заголовок таблиці – тег <САРТIОN>

Тег <CAPTION> дозволяє створювати заголовок таблиці. За замовчуванням заголовки центруються і розміщуються або над (<САРТION АLIGN = top>), або під таблицею (<САРТION ALIGN = bottom>). Тема може складатися з будь-якого тексту і зображень. Текст буде розбитий на рядки, що відповідають ширині таблиці.

Атрибут NOWRAP. Зазвичай будь-який текст, що не вмістився в один рядок комірки таблиці, переходить на наступний рядок. Однак при використанні атрибута NOWRAP з тегами <ТН> або <ТD> довжина комірки розширюється настільки, щоб укладений в ній текст помістився в один рядок.

Атрибут СОLSPAN. Теги <ТD> і <ТН> модифікуються за допомогою атрибута СОLSPAN (Column Span, з'єднання стовпців). Значення атрибута Colspan визначає скільки стовпчиків таблиці має бути об'єднано в комірці з цим атрибутом.

Атрибут ROWSPAN Атрибут ROWSPAN, використовується в тегах <ТD »і« ТН>, подібний до атрибуту СОLSPAN, тільки його значення визначає кількість рядків, що об'єднуються в комірці з цим атрибутом.

Атрибут WIDТН застосовується в двох випадках. Його можна помістити в тег <ТАВLЕ>, щоб задати ширину всієї таблиці, а можна використовувати в тегах <ТD »або« ТН>, щоб задати ширину комірці або групи комірок. Ширину можна вказувати в пікселях або у відсотках. Якщо використовується тег <ТАВLЕ WIDTH = 250>, то на екрані буде сформована таблиця шириною 250 пікселів незалежно від розміру сторінки на моніторі. При використанні тега <TABLE WIDТН = 50%> таблиця буде займати половину ширини контейнера, в якому знаходиться ця таблиця.

Атрибут border. Значення цього атрибута визначає як будуть виглядати рамки таблиці. Якщо атрибут не заданий або його значення дорівнює нулю, то таблиця не матиме рамок.

2.5 Html-форми Форми використовуються в www для передачі інформації від клієнта до сервера.

2.5.1 Завдання форми - тег FORM. Тег FORM визначає форму і межі використання інших тегів, що розміщуються в формі. Усередині пари <FORM> і </ FORM> розміщується послідовність тегів <INPUT>, які формують елементи для введення інформації користувачем. У формі використовуються атрибути method і action. Формат контейнера <FORM> має вигляд:

<FORM action=”URL” METHOD=”GET/POST”>

Де URL – адреса ресурсу, куди буде відіслано вміст форми. Якщо ця адреса відсутня, то буде використаний URL – адреса поточного документа.

METHOD = "GET / POST" – метод, який використовується для відправки вмісту заповненої форми на сервер.

GET – вміст форми пересилається у стартовому рядку запиту.

POST – вміст форми пересилається в тілі запиту.

У формі створюються елементи управління для введення інформації користувачем. Кожен такий елемент повинен мати атрибут NAME, значення якого визначає ім'я цього елемента. Інформація, введених користувачем в елементи форми передається на сервер у вигляді:

Ім'я_елемента = значення.

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

Атрибут TYPE=text. Значення атрибута TYPE=text визначає в якості елемента вводу однорядковий текст. Розмір поля може бути встановлений атрибутом SIZE, наприклад, SIZE=40 для 40-символьного поля. Користувачі можуть вводити і більше символів, ніж ця межа, але з текстовим скролінгом (гортанням) поля, щоб курсор залишався видимим. Верхня межа кількості символів, що вводяться в поле задається атрибутом MAXLENGTH. Атрибут NAME використовується для найменування поля, а атрибут VALUE визначає ініціалізує текстовий рядок у полі, коли документ вперше завантажений.

Атрибут TYPE=password. Значення атрибута TYPE=password визначає в якості елемента вводу однорядковий текст, аналогічне полю типу text, в якому символи, що вводяться, відображаються "зірочками". Такий тип елемента вводу зазвичай використовують для введення пароля.

Атрибут TYPE=hidden. Значення атрибута TYPE=hidden визначає в якості елемента вводу приховане текстове поле, яке у формі не відображається і недоступне для вводу інформації користувачем. Зазвичай таке поле використовується для передачі на сервер будь-якої службової інформації.

Атрибут TYPE=checkbox. Значення атрибута TYPE=checkbox визначає в якості елемента вводу прапорець (checkbox). При надсиланні даних форми на сервер як значення елемента вводу використовується значення атрибута VALUE, але тільки в тому випадку якщо прапорець встановлений (галочка всередині квадратика). Якщо прапорець не встановлений, то значення атрибута VALUE цього елемента вводу на сервер не передається.

Атрибут TYPE=radio. Значення атрибута TYPE=radio визначає в якості елемента вводу радіокнопку (radiobutton). Зазвичай використовується декілька радіокнопок з однаковим ім'ям (значення атрибуту NAME) і різними значеннями атрибута VALUE. У цьому випадку при клацанні мишкою по одній з кнопок вона переводиться в включений стан (чорна точка в середині кнопки), а інші кнопки переводяться в стан вимикання. На сервер передається значення атрибута VALUE тільки обраної кнопки.

Атрибут TYPE=image. Значення атрибута TYPE=image визначає в якості елемента вводу кнопку-зображення, що завантажується з файлу, вказаного як значення атрибуту SRC. При натисканні мишкою по цій кнопці-картинці дані форми передаються серверу, при цьому серверу повідомляються координати x і y тієї точки на зображенні, де відбулося натискання клавищі миші. Інформація про поле типу image записується у вигляді двох пар значень name = value. Значення name виходить за допомогою додавання до назви відповідного поля суфіксів ".x" (абсциси), і ".y" (ординати).

Атрибут TYPE=reset. Значення атрибута TYPE=reset визначає в якості елемента вводу кнопку, напис на якій опеределяєтся значення атрибута VALUE. При клацанні мишкою по цій кнопці всі елементи форми переводяться в стан "за замовчуванням".

Атрибут TYPE=submit. Значення атрибута TYPE=submit визначає в якості елемента вводу кнопку, напис на якій опеределяєтся значення атрибута VALUE. При клацанні мишкою по цій кнопці значення атрибутів VALUE всіх елементів форми передаються на сервер.

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

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

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

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

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

У форми можна включати списки з прокруткою і розкривающий список. Для цього використовується тег <SELECT> . Для визначення переліку пунктів використовують тег <OPTION>. Тег <SELECT> підтримує три необов'язкові атрибути: MULTIPLE, NAME і SIZE.

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

Атрибут SIZE – визначає число видимих користувачеві пунктів списку. Якщо в формі встановлено значення атрибута SIZE = 1, то браузер виводить на екран список у вигляді меню, що випадає. У разі SIZE> 1 браузер представляє на екрані звичайний список. У формі може використовуватися тег <OPTION> тільки всередині тега <SELECT>. Ці теги підтримують два додаткових атрибута: SELECTED і VALUE.

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

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

?

?

?

?

?

?

?