Приклад побудови таблиці з 3 рядків та 4 колонок (3x4)

Той факт, що таблиці застосовуються досить часто і не тільки для відображення табличних даних зумовлений не тільки їх гнучкістю і універсальністю, а й достатній кількості атрибутів тегів <table>, <tr> і <td>.

Далі перераховані деякі атрибути тега <table>, які застосовуються найчастіше.

align

Задає вирівнювання таблиці по краю вікна браузера (горизонтальне вирівнювання). Можна вибрати зі значень left - вирівнювання таблиці по лівому краю, center - по центру і right - по правому краю. Коли використовуються значення left і right, текст починає обтікати малюнок поруч і знизу.

valign

Встановлює вертикальне вирівнювання вмісту клітинки. За замовчуванням контент клітинки розташовується по її вертикалі в центрі (middle), top - вирівнювання вмісту клітинки по верхньому краю рядка, middle - вирівнювання по середині, bottom -вирівнювання по нижньому краю, baseline - вирівнювання по базовій лінії, при цьому відбувається прив'язка вмісту комірки до однієї лінії.

bgcolor

Встановлює колір фону таблиці.

border

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

cellpadding

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

cellspacing

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

cols

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

rules

Повідомляє браузеру, де відображати границі між клітинками. За замовчуванням рамка малюється навколо кожної клітинки, утворюючи тим самим сітку. На додаток можна вказати відображати лінії між колонками (значення cols), рядками (rows) або групами (groups), які визначаються наявністю тегів <thead>, <tfoot>, <tbody>, <colgroup> або <col>. Товщина границі вказується за допомогою атрибута border.

width

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

title

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

Атрибути width, height (висота), align, valign, bgcolor застосовуються і в окремих тегах рядків <tr> та колонок <td>, <th>.

Приклад таблиці з рядком заголовків

Приклад таблиці з об'єднаними клітинками