Створення HTML-таблиць Фрейми і форми

[ виправити ] текст може містити помилки, будь ласка перевіряйте перш ніж використовувати.

скачати

1. Створення HTML-таблиць

1.1 Засіб форматування Web-сторінок - таблиці

Одним з найбільш потужних і широко застосовуються в HTML коштів є таблиці. У HTML таблиці використовуються не тільки традиційно, як метод подання даних, але і як засіб форматування Web-сторінок.

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

Використання таблиць не обмежується лише даними, що складаються з рядів та колонок. Одним із застосувань є організація розташування різноманітних даних на сторінці, які можуть складатися з простого тексту, зображень, інших таблиць і т.д.

Розглянемо спочатку мінімальний набір тегів та їх параметрів, необхідний і достатній для створення нескладних таблиць, потім перейдемо до їх детального опису.

Опис таблиць має розташовуватися всередині розділу документа <body>. Документ може містити довільне число таблиць, причому допускається вкладеність таблиць один в одного. Кожна таблиця повинна починатися тегом <table> і завершуватися тегом </ table>. Всередині тієї пари тегів розташовується опис вмісту таблиці. Будь-яка таблиця складається з однієї або кількох рядків, у кожній з яких задаються дані для окремих осередків.

Загальний вид таблиці:

<TABLE BORDER=3 CELLSPACING=2 CELLPADDING=2 WIDTH= «80%»>

<CAPTION> ... Заголовок таблиці ... </ CAPTION>

<TR> <TD> Першу осередок <TD> друга осередок

<TR> <TD> перша осередок <TD> друга осередок

</ TABLE>

Атрибути мітки TABLE не обов'язкові. За замовчуванням, таблиця виводиться без рамки. Як правило, розмір осередків таблиці встановлюється автоматично, щоб найкращим чином розмістити вміст. Проте можна встановити ширину таблиці за допомогою атрибуту WIDTH. Атрибути BORDER, CELLSPACING і CELLPADDING надають додаткові можливості для контролю над зовнішнім виглядом таблиці. Тема розміщується над або під таблицею в залежності від значення атрибута ALIGN.

Горизонтальний ряд осередків визначається елементом TR, що закриває мітка не обов'язкове. Стовпчики таблиці визначаються елементами TD (для даних) і TH (для заголовків). Як і TR, ці елементи можуть не мати закриває мітки. TH і TD можуть містити кілька атрибутів: ALIGN і VALIGN для вирівнювання вмісту осередку, ROWSPAN і COLSPAN для вказівки того, що осередок займає більше одного горизонтального ряду або колонки. Осередок таблиці може містити інші елементи рівня блоку і тексту, включаючи форми та інші таблиці.

Для елемента TABLE обов'язкові відкриває і закриває мітки. Допустимі атрибути:

align

Допустимі значення: LEFT, CENTER і RIGHT. Визначає положення таблиці відносно до полів документа. За умовчанням встановлено вирівнювання по лівому краю, але це можна змінити шляхом включення в документ елемента DIV або CENTER.

width

При відсутності цього атрибуту ширина таблиці визначається автоматично залежно від вмісту. Атрибут WIDTH можна використовувати для установки фіксованої ширини у пікселях (наприклад, WIDTH = 212) або у відсотках від простору між лівим і правим полем (наприклад, WIDTH = "80%»).

border

Використовується для вказівки ширини зовнішньої окантовки таблиці у пікселях (наприклад, BORDER = 4). Значення можна встановити рівним нулю, в результаті чого окантовка не буде видно. У відсутність цього атрибуту окантовка також не повинна показуватися на екрані. Зверніть увагу: деякі браузери сприймають мітку <TABLE BORDER> точно так само, як BORDER = 1.

cellspacing

У традиційному видавничому програмному забезпеченні розташовані поруч елементи таблиці мають загальну окантовку. У HTML це не так. Кожна комірка має власну окантовку. Ширина окантовки осередку в пікселях встановлюється атрибутом CELLSPACING (наприклад, CELLSPACING = 10). Цей атрибут також встановлює відстань між окантовкою таблиці і окантовками крайніх клітин таблиці.

cellpadding

Встановлює відстань між окантовкою осередки таблиці і вмістом клітинки.

Елемент CAPTION може мати один атрибут ALIGN зі значенням ALIGN = TOP або ALIGN = BOTTOM. Відповідно, заголовок таблиці показується або над, або під таблицею. Більшість браузерів за замовчуванням показують заголовок над таблицею. Відкриває і закриває мітки обов'язкові. У заголовках тибліц не дозволяються елементи рівня блоку.

Елемент TR відкриває опис рядка таблиці. Закриваюча мітка не обов'язкове. Має дві стрібута:

align

Встановлює горизонтальне вирівнювання в клітинках рядка. Допустимі значення: LEFT, CENTER і RIGHT. Дія аналогічно атрибуту ALIGN у абзаців.

valign

Встановлює вертикальне вирівнювання в клітинках рядка. Допустимі значення: TOP, MIDDLE і BOTTOM; вміст комірок при цьому вирівнюється по верхньому краю, по центру або по нижньому краю.

Існує два елементи, що визначають елементи таблиці. TH використовується для осередків-заголовків, а TD - для осередків з даними. Відкривають мітки обов'язкові, що закривають - ні. Осередки можуть мати такі атрибути:

nowrap

Цей атрибут забороняє автоматичний переклад тексту з рядка на рядок всередині комірки таблиці (наприклад, <TD NOWRAP>). Ефект застосування цього атрибуту аналогічний використанню об'єкта замість пропуску по всьому вмісту клітинки.

rowspan

Використовується з позитивним цілим значенням числа рядків таблиці, зайнятих осередком. За замовчуванням прийнято рівним одиниці.

colspan

Використовується з позитивним цілим значенням числа колонок таблиці, зайнятих осередком. За замовчуванням прийнято рівним одиниці.

align

Вказує прийняте за замовчуванням вирівнювання вмісту комірки. Має пріоритет над значенням, встановленим атрибутом ALIGN рядка таблиці. Допустимі значення ті ж самі: LEFT, CENTER і RIGHT. Якщо атрибут ALIGN не вказаний, прийняте за замовчуванням вирівнювання - по лівому краю для <td> і по центру для <th>, однак це можна змінити установкою атрибуту ALIGN елемента TR.

valign

Вказує прийняте за замовчуванням вирівнювання вмісту комірки. Має пріоритет над значенням, встановленим атрибутом ALIGN рядка таблиці. Допустимі значення ті ж самі: TOP, MIDDLE і BOTTOM. Якщо атрибут VALIGN не встановлено, за умовчанням прийнято вирівнювання по центру, однак це можна змінити установкою атрибуту VALIGN елемента TR.

width

Вказує рекомендовану ширину вмісту осередку в пікселях. Значення використовується тільки у випадках, коли воно не суперечить вимогам до ширини інших осередків у колонці.

height

Вказує рекомендовану висоту вмісту осередку в пікселях. Значення використовується тільки у випадках, коли воно не суперечить вимогам до висоти інших осередків в рядку.

Таблиці, як правило, показуються на екрані «піднятими» над поверхнею сторінки, а осередки - «втиснули» в тіло таблиці. Осередки виділяються окантовкою тільки якщо в них є вміст. Якщо вміст комірки складається тільки з пропусків, осередок вважається порожній, за винятком випадків, коли в ній є хоча б один об'єкт.

1.2 Стовпчики таблиці: елементи TH і TD

Визначення атрибутів

headers = idrefs

У цьому атрибуті вказується список осередків заголовків, що надають заголовну інформацію для поточної комірки даних. Значення цього атрибута є розділений пробілами список назв осередків; імена осередкам повинні даватися за допомогою атрибуту id. Автори зазвичай використовують атрибут headers з метою допомогти невізуальні агентам користувачів в генерації заголовків комірок даних (наприклад, заголовок вимовляється перед прочитанням даних комірки), але цей атрибут може також використовуватися разом з таблицями стилів. Див також атрибут scope.

scope = ім'я області дії

Цей атрибут визначає набір осередків даних, для яких заголовна інформація задається поточним заголовком. Цей атрибут може використовуватися замість атрибута <a href= «tables.html#adef-headers» class= «noxref» headers>, особливо в простих таблицях. Якщо цей атрибут використовується, він повинен мати одне з наступних значень:

  • row: В осередку представлена ​​заголовна інформація для решти рядка, в якому міститься цей осередок.

  • col: У поточній комірці представлена ​​заголовна інформація для решти стовпця, в якому міститься цей осередок.

  • rowgroup: В осередку представлена ​​заголовна інформація для залишилася, в якій міститься цей осередок.

  • colgroup: В осередку представлена ​​заголовна інформація для залишилася, в якій міститься цей осередок.

abbr = текст

Цей атрибут слід використовувати для подання скороченої форми вмісту комірки; він може генеруватися агентами користувачів у відповідний момент замість вмісту клітинки. Скорочені імена повинні бути коротше, і агенти користувачів можуть повторювати їх. Наприклад, синтезатори мови можуть генерувати скорочені заголовки, пов'язані з певної комірки, перед генерацією вмісту клітинки.

axis = cdata

Цей атрибут може використовуватися замість осередки в концептуальних категоріях, яка може використовуватися для формування axes в n-мірному просторі. Агенти користувачів можуть давати користувачам доступ до цих категорій (наприклад, користувач може запитувати у агента все комірки, що належать до певної категорії, агент користувача може представляти таблицю у формі змісту і т.д.). Детальніше див о. Значення цього атрибута є список імен категорій, розділених комами.

rowspan = число

Цей атрибут визначає число рядків, spanned поточної осередком. За замовчуванням використовується значення один («1»). Значення нуль («0») означає, що осередок spans всі рядки від поточної до останнього рядка таблиці.

colspan = число

Цей атрибут визначає число стовпців, spanned поточної осередком. За замовчуванням використовується значення один («1»). Значення нуль («0») означає, що осередок spans всі стовпці від поточного до останнього стовпця таблиці.

nowrap

Небажаний. Якщо цей логічний атрибут використовується, він повідомляє візуальним агентам користувачів про необхідність відключити автоматичне розбиття тексту для цього осередку. Для розбиття рядків замість цього атрибуту повинні використовуватися. Примітка. При неуважному використанні цей атрибут може призвести до того, що осередки будуть дуже широкими.

width = пікселі

Небажаний. Цей атрибут дає агентам користувачів рекомендовану ширину комірки.

height = пікселі

Небажаний. Цей атрибут

1.3 Вкладені таблиці

Окремі осередки таблиці можуть містити практично будь-які теги мови і дані дозволені в розділі <body> документа. У тому числі, всередині комірки таблиці може бути цілком розміщена інша таблиця. Такі таблиці називають вкладеними. Правила їх побудови не відрізняються від побудови таблиць і не потребують окремому описі.

Наведемо приклад HTML - коду вкладеної таблиці:

<HTML>

<HEAD> <TITLE> Міста Республіки Дагестан </ TITLE> </ HEAD>

<BODY>

<TABLE BORDER=0 CELLSPACING=0 CELLPADING=0>

<CAPTION> <H2> Міста Республіки Дагестан </ H2>

Н - Населення міста (тис. жит., 1992 р.) & nbsp; & nbsp; & nbsp;

Р - відстань від Махачкали (км) </ CAPTION>

<TR> <TD VALIGN=TOP>

<TABLE BORDER CELLPADDING=3 CELLSPACING=0>

<CAPTION> <STRONG> Селища, підлеглі Махачкалі </ STRONG> </ CAPTION> <TR> <TH> Селище </ TH> <TH> H </ TH> <TH> P </ TH> </ TR>

<TR> <TD> Семендер </ TD> <TD ALIGN=RIGHT> 13.6 </ TD> <TD ALIGN=RIGHT> 50 </ TD> </ TR>

<TR> <TD> Хушет </ TD> <TD ALIGN=RIGHT> 144.6 </ TD> <TD ALIGN=RIGHT> 26 </ TD> </ TR>

<TR> <TD> Кяхулай </ TD> <TD ALIGN = RIGHT 45.2 </ TD> <TD ALIGN=RIGHT> 48 </ TD> </ TR>

<TR> <TD> Редукторний </ TD> <TD ALIGN=RIGHT> 42.0 </ TD> <TD ALIGN=RIGHT> 40 </ TD> </ TR>

<TR> <TD> Сепараторний </ TD> <TD ALIGN=RIGHT> 25.4 </ TD> <TD ALIGN=RIGHT> 30 </ TD> </ TR>

<TR> <TD> 5 Селище </ TD> <TD ALIGN=RIGHT> 83.8 </ TD> <TD ALIGN=RIGHT> 29 </ TD> </ TR>

<TR> <TD> Гур-Гур Аул </ TD> <TD ALIGN=RIGHT> 95.1 </ TD> <TD ALIGN=RIGHT> 24 </ TD> </ TR>

<TR> <TD> Ленінкент </ TD> <TD ALIGN=RIGHT> 34.9 </ TD> <TD ALIGN=RIGHT> 35 </ TD> </ TR> </ TABLE>

<P> <CENTER> Всі селища, підлеглі <BR> адміністрації <BR> Махачкали, мають <BR> прямі міські <BR> номера. </ CENTER> </ TD>

<TD WIDTH=50> </ TD> <TD VALING=TOP>

<TABLE BORDER CELLPADDING=3 CELLSPACING=0>

<CAPTION> <STRONG> Селища обласного підпорядкування </ CAPTION>

<TR> <TH> Селище </ TH> <TH> H </ TH> <TH> P </ TH> </ TR>

<TR> <TD> Кізляр </ TD> <TD ALIGN=RIGHT> 21.6 </ TD> <TD ALIGN=RIGHT> 245 </ TD> </ TR>

<TR> <TD> Бабаюрт </ TD> <TD ALIGN=RIGHT> 50.3 </ TD> <TD ALIGN=RIGHT> 122 </ TD> </ TR>

<TR> <TD> Кізілюрт </ TD> <TD ALIGN=RIGHT> 32.9 </ TD> <TD ALIGN=RIGHT> 24 </ TD> </ TR>

<TR> <TD> Буйнакс до </ TD> <TD ALIGN=RIGHT> 80.9 </ TD> <TD ALIGN=RIGHT> 24 </ TD> </ TR>

<TR> <TD> Каспійськ </ TD> <TD ALIGN=RIGHT> 1.0 </ TD> <TD ALIGN=RIGHT> 159 </ TD> </ TR>

<TR> <TD> Дербент </ TD> <TD ALIGN=RIGHT> 80.9 </ TD> <TD ALIGN=RIGHT> 46 </ TD> </ TR>

<TR> <TD> Ізбербаш </ TD> <TD ALIGN=RIGHT> 11.9 </ TD> <TD ALIGN=RIGHT> 147 </ TD> </ TR>

<TR> <TD> Южно-Сухокумськ </ TD> <TD ALIGN=RIGHT> 5.9 </ TD> <TD ALIGN=RIGHT> 157 </ TD> </ TR>

<TR> <TD> Гунібскій </ TD> <TD ALIGN=RIGHT> 51.5 </ TD> <TD ALIGN=RIGHT> 138 </ TD> </ TR>

<TR> <TD> Курахскій </ TD> <TD ALIGN=RIGHT> 53.8 </ TD> <TD ALIGN=RIGHT> 115 </ TD> </ TR>

<TR> <TD> Левашінскій </ TD> <TD ALIGN=RIGHT> 23.8 </ TD> <TD ALIGN=RIGHT> 55 </ TD> </ TR>

<TR> <TD> Кулінський </ TD> <TD ALIGN=RIGHT> 27.3 </ TD> <TD ALIGN=RIGHT> 244 </ TD> </ TR>

<TR> <TD> Дербентський </ TD> <TD ALIGN=RIGHT> 41.8 </ TD> <TD ALIGN=RIGHT> 139 </ TD> </ TR> </ TABLE> </ TD>

<TD WIDTH=50> </ TD> <TD VALIGN=TOP>

<TABLE BORDER CELLPADDING=3 CELLSPACING=0>

<CAPTION> <STRONG> (Продовження таблиці) </ CAPTION>

<TR> <TH> Селище </ TH> <TH> H </ TH> <TH> P </ TH> </ TR>

<TR> <TD> Кахіб </ TD> <TD ALIGN=RIGHT> 4.7 </ TD> <TD ALIGN=RIGHT> 85 </ TD> </ TR>

<TR> <TD> Телетль </ TD> <TD ALIGN=RIGHT> 11.2 </ TD> <TD ALIGN=RIGHT> 141 </ TD> </ TR>

<TR> <TD> Тереклі-Мектеб </ TD> <TD ALIGN=RIGHT> 22.9 </ TD> <TD ALIGN=RIGHT> 40 </ TD> </ TR>

<TR> <TD> Татархан </ TD> <TD ALIGN=RIGHT> 25.1 </ TD> <TD ALIGN=RIGHT> 246 </ TD> </ TR>

<TR> <TD> Кірка </ TD> <TD ALIGN=RIGHT> 23.1 </ TD> <TD ALIGN=RIGHT> 285 <TD> </ TR>

<TR> <TD> Курах </ TD> <TD ALIGN=RIGHT> 6.7 </ TD> <TD ALIGN=RIGHT> 137 </ TD> </ TR>

<TR> <TD> Гімри </ TD> <TD ALIGN=RIGHT> 20.5 </ TD> <TD ALIGN=RIGHT> 145 </ TD> </ TR>

<TR> <TD> Ахти </ TD> <TD ALIGN=RIGHT> 15.8 </ TD> <TD ALIGN=RIGHT> 201 </ TD> </ TR>

<TR> <TD> Ксумкент </ TD> <TD ALIGN=RIGHT> 42.6 </ TD> <TD ALIGN=RIGHT> 192 </ TD> </ TR>

<TR> <TD> Акуш </ TD> <TD ALIGN=RIGHT> 57.6 </ TD> <TD ALIGN=RIGHT> 81 </ TD> </ TR>

<TR> <TD> Сивуха </ TD> <TD ALIGN=RIGHT> 72.0 </ TD> <TD ALIGN=RIGHT> 200 </ TD> </ TR>

<TR> <TD> Куллар </ TD> <TD ALIGN=RIGHT> 33.8 </ TD> <TD ALIGN=RIGHT> 53 </ TD> </ TR>

<TR> <TD> Даркуш </ TD> <TD ALIGN=RIGHT> 12.5 </ TD> <TD ALIGN=RIGHT> 64 </ TD> </ TR>

</ TABLE> </ TD> </ TR> </ TABLE>

</ BODY> </ HTML>

2. Фрейми та форми

2.1 Поняття фреймів

Фрейми дозволяють розбити вікно перегляду браузера на декілька прямокутних підобластей, розташованих поруч один з одним. У кожну з цих підобластей можна завантажити окремий HTML - документ, перегляд якого здійснюється незалежно від інших. Між фреймами, також як і між окремими вікнами браузера, при необхідності можна організувати взаємодію, яке полягає в тому, що вибір посилання в одному з фреймів може призвести до завантаження потрібного документа в інший кадр або вікно браузера.

Можливість роботи з фреймами вперше реалізована в браузері Netscape 2.0. Наступна версія браузера Netscape 3.0 збагатила можливості фреймів, додавши кілька додаткових параметрів до основних тегам опису структури фреймів. Браузер Microsoft Internet Explorer підтримує фрейми, починаючи з версії 3.0, а також надає унікальну можливість створення плаваючих фреймів.

Розробниками HTML-документів надається досить багатий вибір відображення інформації на сторінках. Текстова та графічна інформація може бути впорядкована і організована за допомогою списків, таблиць або просто за допомогою параметрів вирівнювання, завдання горизонтальних ліній, поділу на абзаци. Іноді цих можливостей виявляється недостатньо і тоді доводиться розбивати вікно перегляду браузера на окремі області або фрейми.

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

Ось простий документ з використанням фреймів:

<! DOCTYPE HTML PUBLIC "/ / W3C   / / DTD HTML 4.0 Frameset   / / EN »>

<HTML>

<HEAD>

<TITLE> Простий документ з фреймами </ TITLE> </ HEAD>

<FRAMESET Cols= «20%, 80%»>

<FRAMESET Rows= "100, 200»>

<FRAME Src= «contents_of_frame1.html»>

<FRAME Src= «contents_of_frame2.gif»>

</ FRAMESET>

<FRAME Src= «contents_of_frame3.html»>

<NOFRAMES>

<P> У цьому документі міститься:

<LI> <A Href= «contents_of_frame1.html»> Миленький текстик </ A>

<LI> <IMG Src= «contents_of_frame2.gif» alt= «Картинка »>

<LI> <A Href= «contents_of_frame3.html»> Славний текст </ A>

</ UL>

</ NOFRAMES>

</ FRAMESET>

</ HTML>

Якщо агент користувача не може представляти фрейми або налаштований так, щоб не робити цього, він повинен генерувати вміст елемента NOFRAMES.

2.2 Розташування фреймів

Документ HTML, в якому описується компонування фреймів (званий документом з фреймами), виглядає не так, як документ HTML без фреймів. Стандартний документ має один розділ HEAD і один розділ BODY. Документ із фреймами має розділ HEAD і розділ FRAMESET, який замінює розділ BODY.

У розділі FRAMESET задається розташування фреймів в основному вікні агента користувача. Крім того, в розділі FRAMESET може бути присутнім елемент NOFRAMES для агентів користувачів, що не підтримують фрейми або сконфігурованих так, щоб їх не показувати.

Елементи, найчастіше, в розділ BODY, не повинні бути присутніми до першого елемента FRAMESET, інакше елемент FRAMESET буде ігноруватися.

Елемент FRAMESET

Визначення атрибутів

rows = multi - length - list

Цей атрибут визначає розташування горизонтальних фреймів. Це розділений комами список пікселів, відсотків і відносних довжин. За замовчуванням використовується 100%, що означать один рядок.

cols = multi - length - list

Цей атрибут визначає розташування вертикальних фреймів. Це розділений комами список пікселів, відсотків і відносних довжин. За замовчуванням використовується 100%, що означать один стовпчик.

Елемент FRAMESET визначає макет основного вікна користувача у вигляді прямокутних просторів.

Установка атрибута rows визначає число горизонтальних відрізків простору в наборі фреймів. Установка атрибута cols визначає число вертикальних відрізків. Для створення сітки можна встановити обидва атрибуту одночасно.

Якщо атрибут rows не встановлено, кожен стовпець займає всю довжину сторінки. Якщо атрибут cols не встановлено, кожен рядок займає всю ширину сторінки. Якщо не встановлено жодного з цих атрибутів, фрейм займає всю сторінку.

Фрейми створюються в напрямку зліва направо для стовпців і зверху вниз для рядків. Якщо вказані обидва атрибуту, розділи вікон створюються зліва направо у верхньому рядку, зліва направо в другому рядку і т.д.

У першому прикладі екран поділяється горизонтально на дві частини (тобто створюються верхня і нижня частини).

<FRAMESET Rows= «50%, 50%»>

... Продовження визначення ...

</ FRAMESET>

У наступному прикладі створюється три стовпці: другий має фіксовану ширину 250 пікселів (це корисно, наприклад, для представлення зображення відомої ширини). Перший кадр отримує 25% решти простору, а третій - 75%.

<FRAMESET Cols= «1*, 250,3*»>

... Продовження визначення ...

</ FRAMESET>

У наступному прикладі створюється сітка 2x3.

<FRAMESET rows = «30%, 70%» cols = «33%, 34%, 33%»>

... Продовження визначення ...

</ FRAMESET>

Для наступного прикладу припустимо, що вікно браузера має висоту суворо 1000 пікселів. Перший розділ отримує 30% загальної висоти (300 пікселів). Другий має висоту рівно 400 пікселів. Залишається 300 пікселів на два інші фрейму. Для четвертого фрейму задана висота «2 *», так що він повинен бути вдвічі вище третього, для якого буде висота «*» (еквівалентно 1 *). Таким чином, третій кадр буде мати висоту 100 пікселів, а четвертий - 200.

<FRAMESET Rows= «30%, 400,*, 2*»>

... Продовження визначення ...

</ FRAMESET>

Абсолютні довжини, якщо вони не дають у сумі 100% реально доступного простору, повинні коректуватися агентом користувача. Якщо вказана довжина менше фактичної, що залишився простір повинен рівномірно розподілятися між усіма розділами. Якщо вказана довжина, що перевищує фактичну, кожен розділ має зменшуватися в залежності від того, яку частину простору він займає.

2.3 Вкладені набори фреймів

Число рівнів вкладеності фреймів не обмежена. У наступному прикладі зовнішній елемент FRAMESET поділяє доступне простір на три рівних стовпця. Внутрішній елемент FRAMESET поділяє друге область на два рядки нерівній висоти.

<FRAMESET Cols= «33%, 33%, 34%»>

... Вміст першого фрейму ...

<FRAMESET Rows= «40%, 50%»>

... Вміст другого фрейму, перший рядок ...

... Вміст другого фрейма, другий рядок ...

</ FRAMESET>

... Вміст третього фрейму ...

</ FRAMESET>

Елемент FRAME

Визначення атрибутів

name = cdata

Призначає ім'я поточному фрейму. Це ім'я може використовуватися в якості мети в наступних посиланнях.

longdesc = uri

Посилання на довгий опис фрейму. Це оголошення повинне доповнювати короткий опис, що задається атрибутом title, і може бути особливо корисно для невізуальних агентів користувачів.

src = uri

Визначає місцезнаходження початкового вмісту фрейма.

noresize

Якщо цей атрибут присутній, він повідомляє агенту користувача, що розміри фрейму змінювати не можна.

scrolling = auto | yes | no

Цей атрибут задає інформацію про прокрутку фрейму. Можливі значення

  • auto: При необхідності надавати можливості прокручування. Це значення використовується за замовчуванням.

  • yes: Завжди надавати можливості прокручування.

  • no: Не надавати можливості прокручування.

frameborder = 1 | 0

Цей атрибут надає агенту користувача інформацію про кордон фрейму. Можливі значення:

  • 1: Агент користувача повинен зобразити роздільник між цим фреймах і всіма прилеглими фреймами. Це значення використовується за замовчуванням.

  • 0: Агент користувача не повинен відображати роздільник. Зверніть увагу, що роздільники можуть все одно відображатиметься, якщо вони задані в інших фреймах.

marginwidth = пікселі

Цей атрибут задає простір, що залишається у фреймі як лівого і правого полів. Значення має перевищувати один піксель. Значення за умовчанням залежить від агента користувача.

marginheight = пікселі

Цей атрибут визначає верхнє і нижнє поля в фреймі. Значення має перевищувати один піксель. Значення за умовчанням залежить від агента користувача.

Атрибути, обумовлені в іншому місці

  • title ()

  • target ()

Елемент FRAME визначає вміст і вигляд одного фрейму.

Атрибут src визначає вихідний документ, що міститься в фреймі.

У наступному прикладі документа HTML:

<! DOCTYPE HTML PUBLIC "-   / / W3C   / / DTD HTML 4.0 Frameset   / / EN »

«_THE_LATEST_VERSION_ / Frameset.dtd»>

<HTML>

<HEAD> <TITLE> Документ з фреймами </ TITLE> </ HEAD>

<FRAMESET Cols= «33%, 33%, 33%»>

<FRAMESET Rows= "*, 200»>

<FRAME Src= «contents_of_frame1.html»>

<FRAME Src= «contents_of_frame2.gif»>

</ FRAMESET>

<FRAME Src= «contents_of_frame3.html»>

<FRAME Src= «contents_of_frame4.html»>

</ FRAMESET>

</ HTML>

Агент користувача повинен завантажувати кожен файл в окремий розділ. Вміст фрейму і його визначення не повинні знаходитися в одному документі.

2.4 Визначення мети фрейму

Визначення атрибутів

target = frame-target

Зазначає ім'я фрейму, в якому повинен відкриватися документ.

Призначаючи фрейму ім'я за допомогою атрибута name, автори можуть посилатися на нього як на "target» для посилань, що визначається іншими елементами. Атрибут target може встановлюватися для елементів, що створюють посилання (A, LINK), навігаційних карт (AREA) та форм (FORM).

Інформацію про розпізнаваних іменах фреймів Ви можете знайти в розділі про.

У цьому прикладі показано, як мети забезпечують динамічний зміна вмісту фрейма. Спочатку визначимо набір фреймів в показаному тут документі frameset.html:

<! DOCTYPE HTML PUBLIC "-   / / W3C   / / DTD HTML 4.0 Frameset   / / EN »

«_THE_LATEST_VERSION_ / Frameset.dtd»>

<HTML>

<HEAD>

<TITLE> Документ з фреймами </ TITLE>

</ HEAD>

<FRAMESET Rows= «50%, 50%»>

<FRAME Name= «fixed» src= «init_fixed.html»>

<FRAME Name= «dynamic» src= «init_dynamic.html»>

</ FRAMESET>

</ HTML>

Потім в файлі init_dynamic.html ми будемо посилатися на фрейм з ім'ям «dynamic».

<! DOCTYPE HTML PUBLIC "-   / / W3C   / / DTD HTML 4.0 Frameset   / / EN »

«_THE_LATEST_VERSION_ / Frameset.dtd»>

<HTML>

<HEAD>

<TITLE> Документ з якорями з певними цілями </ TITLE>

</ HEAD>

<BODY>

... Початок документа ...

<P> Тепер можна перейти до

<A Href= «slide2.html» target= «dynamic»> слайда 2. </ A>

... Продовження документа ...

<P> Все відмінно. Переходимо до

<A Href= «slide3.html» target= «dynamic»> слайда 3. </ A>

</ BODY>

</ HTML>

Активізація будь-який з посилань призведе до відкриття нового документа у фреймі з ім'ям «dynamic», в той час як в іншому фреймі, «fixed», зберігається початковий вміст.

Примітка. Визначення набору фреймів ніколи не змінюється, але вміст одного з фреймів може змінюватися. При зміні вихідного вмісту одного з фреймів визначення набору фреймів більше не відображає поточного стану фреймів. На даний момент неможливо кодувати повністю стан набору фреймів в URI. Таким чином, багато агентів користувачів не дозволяють користувачам вносити набори фреймів в закладки.

Набори фреймів можуть ускладнювати перехід вперед або назад по списку переглянутих в агента користувача сторінок.

Якщо в багатьох посиланнях в документі використовується одна і та ж мета, можна вказати її один раз і використовувати скрізь за допомогою атрибуту target кожного елемента. Це робиться за допомогою установки атрибута target елемента BASE.

Повернемося до попереднього прикладу і визначимо інформацію про мету в елементі BASE і видалимо її з елементів A.

<! DOCTYPE HTML PUBLIC "-   / / W3C   / / DTD HTML 4.0 Frameset   / / EN »

«_THE_LATEST_VERSION_ / Frameset.dtd»>

<HTML>

<HEAD>

<TITLE> Документ із визначенням мети в елементі BASE </ TITLE>

<BASE Href= «http://www.mycom.com/Slides» target= «dynamic»>

</ HEAD>

<BODY>

... Початок документа ...

<P> Тепер Ви можете перейти до <A href= «slide2.html»> слайда 2. </ A>

... Продовження документа ...

<P> Все відмінно. Переходимо до

<A Href= «slide3.html»> слайда 3. </ A>

</ BODY>

</ HTML>

Агенти користувачів повинні визначати цільової фрейм, в який повинен завантажуватися пов'язаний ресурс відповідно до таких пріоритетів (від вищого до нижчого):

  1. Якщо в елементі встановлений атрибут target і використовується відомий кадр, при активізації елемента (тобто клацанні на посилання або обробці форми) призначається елементом ресурс повинен завантажуватися у вказаному цільовому фреймі.

  2. Якщо для елемента не встановлений атрибут target, а в елементі BASE він встановлений, фрейм визначається атрибутом target елемента BASE.

  3. Якщо ні в самому елементі, ні в елементі BASE мета не вказана, призначений елементом ресурс повинен завантажуватися у фрейм, в якому міститься сам елемент.

  4. Якщо в атрибуті target зазначений невідомий фрейм F, агент користувача повинен створити нове вікно і фрейм, призначити фрейму ім'я F і завантажити призначуваний елементом ресурс у новий фрейм.

Агенти користувачів можуть забезпечувати для користувачів механізм перевизначення атрибута target.

2.5 Альтернативне вміст

Автори повинні вказувати альтернативне вміст для агентів користувачів, що не підтримують фрейми або сконфігурованих так, щоб не відображати їх.

Елемент NOFRAMES задає вміст, який має відображатися, тільки якщо не відображаються фрейми. Агенти користувачів, підтримують фрейми, повинні відображати вміст оголошення NOFRAMES, тільки якщо вони сконфігуровані так, щоб не відображати фрейми. Агенти користувачів, які не підтримують фрейми, повинні відображати вміст елемента NOFRAMES в будь-якому випадку.

Елемент NOFRAMES можна використовувати в розділі FRAMESET документа з фреймами. Наприклад:

<NOFRAMES>

<P> Це <A href = «main - noframes. Html"> Версія документа без фреймів. </ A>

</ NOFRAMES>

Атрибут longdesc дозволяє авторам зробити документи з використанням фреймів більш доступними для людей, що використовують невізуальні агенти. У цьому атрибуті призначається ресурс, що надає довгий опис фрейму. Авторам варто звернути увагу, що довгі описи, пов'язані з фреймами, прикріплюються до фрейму, а не до його вмісту. Оскільки вміст може змінюватися, вихідне довгий опис, швидше за все, перестане відповідати вмісту фрейма. Зокрема, не слід включати зображення як єдине вміст фрейма.

У наступному документі з фреймами описуються два фрейми. У лівому фреймі знаходиться зміст, а в правому спочатку - зображення устриці:

<! DOCTYPE HTML PUBLIC "-   / / W3C   / / DTD HTML 4.0 Frameset   / / EN »

«_THE_LATEST_VERSION_»>

<HTML>

<HEAD>

<TITLE> Погано складений документ з фреймами </ TITLE>

</ HEAD>

<FRAMESET Cols= «20%, 80%»>

<FRAME Src= «table_of_contents.html»>

<FRAME Src= «ostrich.gif» longdesc= «ostrich-desc.html»>

</ FRAMESET>

</ HTML>

Зверніть увагу, що зображення включено в кадр незалежно від будь-якого елементу HTML, так що у автора немає іншої можливості вказати альтернативний текст, крім атрибуту longdesc. Якщо вміст правого фрейму зміниться (наприклад, користувач вибере в змісті змію), у користувача не буде текстового доступу до нового вмісту фрейма.

Таким чином, автори не повинні вміщувати зображення безпосередньо у фрейм. Замість цього зображення повинне включатися в окремий документ HTML і забезпечуватися там відповідним альтернативним текстом:

2.6 Вбудовані фрейми: елемент IFRAME

Визначення атрибутів

longdesc = uri

Цей атрибут визначає посилання на довгий опис фрейму. Цей опис має доповнювати короткий опис, що задається атрибутом title, і особливо корисно для невізуальних агентів користувачів.

name = cdata

Цей атрибут призначає ім'я поточного сайта. Ім'я може використовуватися в якості мети в посиланнях.

width = довжина

Довжина вбудованого фрейма.

height = довжина

Висота вбудованого фрейма.

Атрибути, обумовлені в іншому місці

  • id, class ()

  • title ()

  • style ()

  • name, src, frameborder, marginwidth, marginheight, scrolling ()

  • target ()

  • align ()

Елемент IFRAME дозволяє авторам вставляти фрейм у блок тексту. Вставка вбудованого фрейма в розділ тексту скоріше схожа на вставку об'єкта за допомогою елемента OBJECT: обидва вони дозволяють Вам вставити один документ HTML в іншій, обидва можуть вирівнюватися щодо навколишнього тексту і т.д.

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

Для підтримують фрейми агентів користувачів в наступному прикладі в текст буде поміщений відокремлений кордоном вбудований фрейм.

<IFRAME src = «foo.html» width = "400" height = "500"

scrolling = «auto» frameborder = «1»>

[Ваш агент не підтримує фрейми або налаштований так, щоб не відображати їх. Однак Ви можете переглянути

<A Href= «foo.html»> цей документ. </ A>]

</ IFRAME>

Змінювати розмір вбудованих фреймів можна.

2.7 Поняття форми

Форма HTML - це розділ документа, в якому містяться звичайна інформація, розмітка і спеціальні елементи, звані керуючими елементами (прапорці, кнопки з залежною фіксацією, меню і т.д.), а також мітки цих керуючих елементів. Зазвичай користувачі «заповнюють» форму, модифікуючи керуючі елементи (вводячи текст, вибираючи пункти меню і т.д.) перед тим, як надати форму агенту користувача для обробки (наприклад, на Web-сервер, на поштовий сервер і т.д.)

Користувачі взаємодіють з формами за допомогою іменованих керуючих елементів.

«Ім'я елемента» задається атрибутом name. Областю дії атрибута name для керуючого елемента в елементі FORM є елемент FORM.

Кожен керуючий елемент має початковий і поточне значення, обидва вони є символьними рядками. Інформацію про початкові значеннях і можливі обмеження на значення. У загальному випадку «початкове значення» керуючого елемента може задаватися за допомогою атрибута value. Проте початкове значення елемента TEXTAREA задається його вмістом, а вихідне значення елемента OBJECT у формі визначається реалізацією об'єкта (тобто лежить поза області, що розглядається в даній специфікації).

"Поточне значення» керуючого елемента спочатку встановлюється рівним початкового значення. Потім поточне значення може змінюватися користувачем або

Початкове значення керуючого елемента не змінюється. Таким чином при скиданні форми кожне поточне значення встановлюється рівним початкового значення. Якщо керуючий елемент не має початкового значення, результат скидання форми непередбачуваний.

Коли форма надається для обробки, з формою пари керуючий елемент-поточне значення. Передані пари ім'я / значення називаються.

У HTML визначено такі типи елементів керування:

кнопки

Автори можуть створювати три типи кнопок:

  • кнопки відправки: При активізації такої кнопки проводиться. У формі може бути кілька кнопок відправки.

  • кнопки скидання: При активізації такої кнопки для всіх керуючих елементів встановлюються

  • інші кнопки: Для таких кнопок дію за умовчанням не визначено. З атрибутами кожної такої кнопки можуть бути пов'язані. Якщо відбувається подія (наприклад, користувач натискає кнопку, відпускає її і т.д.), включається пов'язаний з подією скрипт.

Автори повинні визначати мову скрипта для кнопок у (в елементі META).

Автори створюють кнопки за допомогою елемента BUTTON або INPUT. Докладніше про визначення різних типів кнопок.

прапорці

Прапорці (і кнопки з залежною фіксацією) - це перемикачі вкл. / викл., Які можуть перемикатися користувачем. Перемикач «включений», якщо для керуючого елементу встановлено атрибут selected.

При відправці форми можуть стати тільки включені перемикачі. Кілька прапорців у формі можуть мати одне і те ж Таким чином, наприклад, прапорці дозволяють користувачам вибрати кілька значень для одного і того ж властивості. Для створення прапорців використовується елемент INPUT.

кнопки з залежною фіксацією

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

меню

Надають користувачам варіанти на вибір. Меню створюється за допомогою елемента SELECT, а також елементів OPTGROUP і OPTION.

текстовий введення

Для введення тексту користувачем автори можуть створювати управляючі елементи двох типів. Елемент INPUT створює керуючий елемент для введення тексту з одного рядка, а елемент TEXTAREA - елемент для введення тексту з кількох рядків. В обох випадках текст, що вводиться стає керуючого елемента.

вибір файлів

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

приховані керуючі елементи

Автори можуть створювати управляючі елементи, не представляються користувачам, але мають значення, які передаються з формою. Зазвичай вони використовуються для зберігання інформації між обміном клієнт / сервер, яка в іншому випадку могла б прірву внаслідок stateless природи протоколу HTTP (див.). Для створення прихованого керуючого елемента використовується елемент INPUT.

об'єкти

Автори можуть розміщувати у форми загальні об'єкти, так що пов'язані з ними значення будуть передаватися з іншими керівниками елементами. Для створення таких керуючих елементів використовується елемент OBJECT.

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

Початковий тег: обов'язковий, Кінцевий тег: обов'язковий

Визначення атрибутів

action = uri

Визначає агента для обробки форми. Наприклад, значенням може бути URI HTTP (для передачі форми в програму) або mailto URI (для відправлення форми по електронній пошті).

method = get | post

Визначає метод HTTP, використовуваний для передачі. Можливі значення (з урахуванням регістру) - «get» (за замовчуванням) і «post».

enctype = content - type

Цей атрибут задає, використовуваний для відправки форми на сервер (якщо для методу використовується значення «post»). За замовчуванням для цього атрибуту використовується значення «application / x-www-form-urlencoded». З елементом INPUT, type = «file» має використовуватися значення «multipart / form-data».

accept-charset = список наборів символів

Цей атрибут задає список для введення даних, які повинні прийматися обробляють цю форму сервером. Значенням є розділений пробілами та / або комами список значень. Сервер повинен інтерпретувати цей список як список виключають або, тобто він повинен приймати будь-яке кодування для завантаженого об'єкта.

За замовчуванням значенням цього атрибута є зарезервована рядок «UNKNOWN». Агенти користувачів можуть інтерпретувати це значення як кодування символів, що використовується для передачі документа, що містить цей елемент FORM.

accept = content - type - list

Цей атрибут визначає розділеним запитом список типів вмісту, які повинен коректно обробляти сервер, що обробляє форму. Агенти користувачів можуть використовувати цю інформацію для відфільтровування відповідають специфікації файлів при пропозиції користувачу вибору файлів для відправки на сервері (якщо в елементі INPUT зазначено type = «file»).

Атрибути, обумовлені в іншому місці

  • title ()

  • target ()

Елемент FORM служить контейнерів для. Він визначає:

  • Макет форми (дається вмістом елемента).

  • Програму, яка буде опрацьовувати заповнену і передану форму (атрибут action). ОДЕРЖУЄ форму програма повинна мати можливість визначення пар ім'я / значення, щоб їх використати.

  • Метод відправки даних на сервер (атрибут method).

  • Кодування символів, яка повинна прийматися сервером для обробки цієї форми (атрибут accept-charset). Агенти користувачів можуть рекомендувати користувачеві значення атрибуту accept-charset і / або не дозволяти користувачам вводити нерозпізнані символи.

Форма крім може містити текст і розмітку (абзаци, списки і т.д.).

У наступному прикладі показана форма, яка повинна оброблятися програмою «adduser». Ця форма буде відправлятися з використанням методу HTTP «post».

<FORM Action= «http://somesite.com/prog/adduser» method= «post»>

... Вміст форми ...

</ FORM>

У наступному прикладі показано відправка форми на адресу електронної пошти:

<FORM Action= «mailto: Kligor.T@gee.whiz.com» method= «post»>

... Вміст форми ...

</ FORM>

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

Початковий тег: обов'язковий, Кінцевий тег: заборонено

Визначення атрибутів

type = text | password | checkbox | radio | submit | reset | file | hidden | image | button

Визначає. За замовчуванням використовується значення «text».

name = cdata

Визначає.

value = cdata

Визначає керуючого елемента. Цей атрибут не обов'язковий, якщо тільки для атрибута type не встановлено значення «radio».

size = cdata

Повідомляє агенту користувача початкову ширину керуючого елемента. Ширина дається в, якщо для атрибута type не встановлено значення «text» або «password». У цьому випадку ширина задається в числі символів (число повинне бути цілим).

maxlength = число

Якщо для атрибута type встановлено значення «text» або «password», цей атрибут визначає максимальне число символів, що вводяться користувачем. Це число може перевищувати зазначений в атрибуті size розмір поля; в цьому випадку агент користувача повинен забезпечувати механізм прокрутки. За умовчанням число символів не обмежена.

checked

Якщо для атрибута type встановлено значення «radio» або «checkbox», цей логічний атрибут вказує, що прапорець встановлений. Агенти користувачів повинні ігнорувати цей атрибут для інших типів керуючих елементів.

src = uri

Якщо атрибут type має значення «image», цей атрибут визначає місце розташування зображення, використовуване для представлення графічної кнопки.

Атрибути, обумовлені в іншому місці

  • title ()

  • alt ()

  • align ()

визначається елементом INPUT, залежить від значення атрибута type:

text

Створює елемент з одного рядка.

password

Аналогічний значенням «text», але текст, що вводиться представляється таким чином, щоб не відображати символи (наприклад, у вигляді ряду зірочок). Цей керуючий елемент часто використовується для введення паролів. Зверніть увагу, що є текст, введений користувачем, а не текст, що подається агентом користувача.

Примітка. Розробникам програм слід звернути увагу на те, що цей механізм забезпечує тільки слабкий захист. Хоча ваш пароль маскується агентом користувача від випадкових спостерігачів, він передається на сервер у вигляді відкритого тексту, і його може прочитати будь-який користувач, який має доступ до мережі на низькому рівні.

checkbox Створює

radio Створює

submit Створює

image Створює графічну Значення атрибута src задає URI зображення, використовуваного для подання кнопки. З міркувань доступності авторам варто передбачати для зображення за допомогою атрибуту alt.

Якщо для клацання на зображенні використовується указующей пристрій, на сервер передаються форма і координати клацання. Значення x вимірюється в від лівої межі зображення, а значення y - в від верхньої межі зображення. У передані дані включаються послідовності ім'я. X = значення-x і name. Y = значення-y, де «ім'я» - значення атрибута name, а значення-x і значення-y - значення координат x і y відповідно.

Якщо сервер вживає різних дії залежно від місця клацання, користувачі неграфічних браузерів не зможуть скористатися цією властивістю. З цієї причини авторам варто передбачати альтернативні підходи:

  • Використовувати кілька кнопок відправки (кожна з окремим зображенням) замість однієї графічної кнопки. Можна використовувати для управління місцем розташування цих кнопок таблиці стилів.

  • Використовувати і скрипти.

reset Створює кнопку скидання.

button Створює іншу кнопку. Агенти користувачів повинні використовувати як мітки на кнопці значення атрибута value.

hidden Створює невидимий керуючий елемент.

file Створює керуючий елемент вибір файлу. Агенти користувачів можуть використовувати значення атрибута value в якості вихідного імені файлу.

У наступному фрагменті коду HTML визначається проста форма, що дозволяє користувачам вводити ім'я, прізвище, адресу електронної пошти та підлогу. У разі активізації кнопки відправки форма передається програмі, зазначеної в атрибуті action.

<FORM Action= «http://somesite.com/prog/adduser» method= «post»>

<P>

Ім'я: <INPUT type= «text» name= «firstname»> <BR>

Прізвище: <INPUT type= «text» name= «lastname»> <BR>

email: <INPUT type= «text» name= «email»> <BR>

<INPUT Type= «radio» name= «sex» value= «Male»> Чоловік <BR>

<INPUT Type= «radio» name= «sex» value= «Female»> Жіночий <BR>

<INPUT Type= «submit» value= «Надіслати »> <INPUT type= «reset»>

</ P>

</ FORM>

У наступному прикладі показано, як вміст зазначеного користувачем файлу - може передаватися разом з формою. У користувача запитується ім'я і список імен файлів, вміст яких має передаватися з формою. За допомогою вказівки значення enctype для «multipart / form-data» вміст всіх файлів буде пакуватися для передачі в окремі розділи існуючого документа.

<FORM action = «http://server.dom/cgi/handle»

enctype = «multipart / form-data»

method = «post»>

<P>

Як Вас звуть? <INPUT Type= «text» name= «name_of_sender»>

Які файли Ви надсилаєте? <INPUT Type= «file» name= «name_of_files»>

</ P>

</ FORM>

Початковий тег: обов'язковий, Кінцевий тег: обов'язковий

Визначення атрибутів

name = cdata

Визначає

value = cdata

Визначає кнопки.

type = submit | button | reset

Оголошує тип кнопки. Можливі значення:

  • submit: Створює Це значення використовується за замовчуванням.

  • reset: Створює

  • button: Створює

Кнопки, що створюються за допомогою елемента BUTTON, діють так само, як і кнопки, що створюються за допомогою елемента INPUT, але вони забезпечують більш багаті можливості подання: елемент BUTTON може мати вміст. Наприклад, елемент BUTTON, що містить зображення, діє і може resemble подібно елементу INPUT, для атрибута type якого встановлено значення «image», але тип елемента BUTTON може мати вміст content.

Візуальні агенти користувачів можуть представляти кнопки BUTTON рельєфно або з ефектом натискання при клацанні миші, у той час як кнопки INPUT можуть представлятися тільки як «плоскі» зображення.

У наступному прикладі попередній приклад розширюється, і кнопки і створюються за допомогою елемента BUTTON замість елемента INPUT. Використовуване для кнопок зображення визначається елементом IMG.

<FORM action = «http: / / somesite. Com / prog / adduser» method = «post»>

<P>

Ім'я: <INPUT type= «text» name= «firstname»> <BR>

Прізвище: <INPUT type= «text» name= «lastname»> <BR>

email: <INPUT type= «text» name= «email»> <BR>

<INPUT Type= «radio» name= «sex» value= «Male»> Чоловік <BR>

<INPUT Type= «radio» name= «sex» value= «Female»> Жіночий <BR>

<BUTTON Name= «submit» value= «Відправити» type= «submit»>

Send <IMG src=»/icons/wow.gif» alt= «Ого »> </ BUTTON>

<BUTTON Name= «reset» type= «reset»>

Reset <IMG src=»/icons/oops.gif» alt= «ой »> </ BUTTON>

</ P>

</ FORM>

Пам'ятайте, що авторам варто передбачати для елемента IMG.

Не допускається пов'язувати зображення-карту з елементом IMG, содержащімя в елементі BUTTON element.

Початковий тег: обов'язковий, Кінцевий тег: обов'язковий

Визначення атрибутів елемента SELECT

name = cdata

Визначає

size = number

Якщо елемент SELECT представлений у вигляді списку з можливістю прокрутки, цей атрибут визначає число рядків у списку, видимих ​​в один момент часу. Візуальні агенти користувачів не обов'язково мають представляти елемент SELECT у вигляді списку; вони можуть використовувати інші механізми - наприклад, що випадають меню.

multiple

Якщо цей логічний атрибут встановлено, він дозволяє вибирати кілька пунктів. Якщо він не встановлений, в елементі SELECT можна вибрати тільки один варіант.

Елемент SELECT створює. Кожен варіант пункт меню представляється елементом OPTION. Елемент SELECT повинен містити хоча б один елемент OPTION.

Елемент OPTGROUP element дозволяє авторам логічно групувати варіанти. Зазвичай це корисно, якщо користувач повинен робити вибір в довгому списку варіантів; групи пов'язаних варіантів простіше переглядати і запам'ятовувати, чим один довгий список варіантів. У HTML 4.0 всі елементи OPTGROUP повинні задаватися безпосередньо в елементі SELECT (тобто групи не можуть бути вкладеними).

Література

  1. Матросов А.В., Сергєєв А.О., Чаунін М. П. HTML 4.0 - СПб.: БХВ - Петербург, 2007. - 672 с.

  2. Фінком М.В. Інтернет. Крок другий: від користувача до професіонала - Спб.: Наука і Техніка, 2002. - 768 з.

  3. Левін А.Ш. Самовчитель роботи на комп'ютері. 8-е изд. - СПб.: Питер, 2005. - 655 с.

  4. Леонтьєв В.П. Новітня енциклопедія персонального комп'ютера 2004 - М.: Олма-Пресс, 2004.

  5. Нікамін В.А. Цифрова звукозапис: технології та стандарти - СПб.: Наука і Техніка, 2002.

  6. Специфікація HTML 4.0

Додати в блог або на сайт

Цей текст може містити помилки.

Програмування, комп'ютери, інформатика і кібернетика | Методичка
204.2кб. | скачати


Схожі роботи:
Створення таблиць пепевірка орфографії Методи створення таблиць перевірки орфографії
Створення двохвимірних таблиць
Створення Web сайту на мові html
Створення Web документів Використання мови HTML
Створення Web-документів Використання мови HTML
Створення таблиць за допомогою SQL-запитів в середовищі DELPHI
Створення таблиць за допомогою SQL-запитів в середовищі DELPHI 2
Створення таблиць за допомогою SQL запитів в середовищі DELPHI
Загальні відомості про HTML принципи створення Web-сайту
© Усі права захищені
написати до нас