• Гідрологія і Гідрометрія
• Господарське право
• Економіка будівництва
• Економіка природокористування
• Економічна теорія
• Земельне право
• Історія України
• Кримінально виконавче право
• Медична радіологія
• Методи аналізу
• Міжнародне приватне право
• Міжнародний маркетинг
• Основи екології
• Предмет Політологія
• Соціальне страхування
• Технічні засоби організації дорожнього руху
• Товарознавство продовольчих товарів

Тлумачний словник
Авто
Автоматизація
Архітектура
Астрономія
Аудит
Біологія
Будівництво
Бухгалтерія
Винахідництво
Виробництво
Військова справа
Генетика
Географія
Геологія
Господарство
Держава
Дім
Екологія
Економетрика
Економіка
Електроніка
Журналістика та ЗМІ
Зв'язок
Іноземні мови
Інформатика
Історія
Комп'ютери
Креслення
Кулінарія
Культура
Лексикологія
Література
Логіка
Маркетинг
Математика
Машинобудування
Медицина
Менеджмент
Метали і Зварювання
Механіка
Мистецтво
Музика
Населення
Освіта
Охорона безпеки життя
Охорона Праці
Педагогіка
Політика
Право
Програмування
Промисловість
Психологія
Радіо
Регилия
Соціологія
Спорт
Стандартизація
Технології
Торгівля
Туризм
Фізика
Фізіологія
Філософія
Фінанси
Хімія
Юриспунденкция

Cellspacing

Border

Width

Align

Scope

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

У Web-дизайні таблиці є способом організації даних.

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

Теги HTML, що використовуються при створенні таблиць:

<table></table>

Елемент table потрібен, щоб вказати браузеру, що контент необхідно організувати в табличному вигляді.

<tr></tr>

Елемент tr визначає рядок таблиці. Це дозволяє браузеру організувати вміст між тегами <tr> і </tr> у горизонтальному вигляді, або все в рядку.

<td></td>

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

Базові елементи повинні бути вкладені один в одного наступним чином:

<table>

<tr>

<td> комірка 1 </td>

<td> комірка 2 </td>

<td> комірка 3 </td>

</tr>

</table>

Додаткові елементи:

<caption></caption>

Елемент caption дозволяє створити заголовок для даних таблиці. Більшість браузерів будуть вирівнювати заголовок у центрі і робити його такої ж ширини, як і таблиця, якщо тільки для іншого вирівнювання тексту не використовується CSS.

<th></th>

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

Розглянемо приклад таблиці.

<table>

<caption> Основні виверження вулканів </caption >

<tr>

<th> Назва вулкана </th >

<th> Розташування </th >

<th> Останнє велике виверження </th >

<th> Тип виверження </th >

</tr>

<tr>

<td>Гора Лассен </td>

<td> Каліфорнія </td>

<td> 1914-17 </td>

<td> Вибухове виверження </td>

</tr>

<tr>

<td> Гора Худ </td>

<td> Орегон </td>

<td> 1790 </td>

<td> Пірокластичні і сельові потоки </td>

</tr>

<tr>

<td> Гора Сент-Хеленс </td>

<td> Вашингтон </td>

<td> 1980 </td>

<td> Вибухове виверження </td>

</tr>

</table>

Додамо ще декілька структурних елементів.

thead, tbodyі tfoot

Ці елементи визначають верхній колонтитул, тіло і нижній колонтитул таблиці відповідно.

У складних таблицях, використання їх може не тільки структурувати вміст для кодувальника, але також для браузерів та інших пристроїв.

У тегах th можна також помітити атрибути scope, а також те, що назви вулканів були визначені як заголовки всередині рядків даних!

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

colspanіrowspan

Атрибут colspan створює комірку таблиці, яка буде охоплювати більше одного стовпця.

Атрибут rowspan дозволить комірці таблиці охоплювати кілька рядків, наприклад, <td rowspan="3">.

Допустимі атрибути для тегу <table>

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

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

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

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

Переглядів: 636