Відмінності між версіями «7 Таблиці»

Версія за 17:49, 24 грудня 2012 (переглянути вихідний код) Tomash (Обговорення) ← Попереднє редагування		Версія за 18:03, 24 грудня 2012 (переглянути вихідний код) Tomash (Обговорення) Наступне редагування →
Рядок 1:		Рядок 1:
−	У HTML є потужний інструмент відображення інформації, структурованої у вигляді таблиць. Для цього передбачено десяток структурних тегів. Найпростіша таблиця складається з елемента <nowiki><table></nowiki>, що включає по одному або кілька елементів <tr>, <th> і <td>.	+	У HTML є потужний інструмент відображення інформації, структурованої у вигляді таблиць. Для цього передбачено десяток структурних тегів. Найпростіша таблиця складається з елемента table, що включає по одному або кілька елементів tr, th і td.
−	Якщо необхідно відобразити опис таблиці, то його можна помістити в елемент <nowiki><caption></nowiki>, наявний відразу за відкриваючим тегом <table>. Далі послідовно розташовуються рядка таблиці, що позначаються тегом <tr>. Кожен рядок містить в собі комірку <nowiki><th></nowiki> або <nowiki><td></nowiki>, формуючи таким чином стовпці таблиці.	+	Якщо необхідно відобразити опис таблиці, то його можна помістити в елемент caption, наявний відразу за відкриваючим тегом <table>. Далі послідовно розташовуються рядка таблиці, що позначаються тегом tr. Кожен рядок містить в собі комірку th або td, формуючи таким чином стовпці таблиці.
−	Елементи <nowiki><th></nowiki> позначають комірки з заголовками стовпців або рядків. Вміст їх за замовчуванням відображається браузерами жирним накресленням і центрується. Тег <nowiki><td></nowiki> ж призначений для всіх інших комірок з даними. Наявність заголовків <nowiki><th></nowiki> не є обов'язковим, але в таблиці повинна бути хоча б один рядок з однією коміркою.	+	Елементи th позначають комірки з заголовками стовпців або рядків. Вміст їх за замовчуванням відображається браузерами жирним накресленням і центрується. Тег td ж призначений для всіх інших комірок з даними. Наявність заголовків th не є обов'язковим, але в таблиці повинна бути хоча б один рядок з однією коміркою.
−	За допомогою атрибуту border елемента <nowiki><table</nowiki>> можна визначити, чи будуть комірки таблиці обведені рамкою чи ні.	+	За допомогою атрибуту border елемента tableможна визначити, чи будуть комірки таблиці обведені рамкою чи ні.
	Таблиці в HTML є одним з найнеобхідніших елементів і самими універсальними засобами форматування картинок і тексту. Є, звичайно, і альтернативні способи, такі як шари наприклад, але це громіздко, тяжко і незручно ... Справа в тому, що всяка бродилка бачить шари по своєму, і для більш менш пристойного відображення шарів необхідно писати довгий і нудний скрипт, та й той не панацея ... У той час, як таблиці, хоч у деяких нюансах нерідко і розходяться, але розбіжність-то мінімально.		Таблиці в HTML є одним з найнеобхідніших елементів і самими універсальними засобами форматування картинок і тексту. Є, звичайно, і альтернативні способи, такі як шари наприклад, але це громіздко, тяжко і незручно ... Справа в тому, що всяка бродилка бачить шари по своєму, і для більш менш пристойного відображення шарів необхідно писати довгий і нудний скрипт, та й той не панацея ... У той час, як таблиці, хоч у деяких нюансах нерідко і розходяться, але розбіжність-то мінімально.
Рядок 56:		Рядок 56:
	У тегах tr і td також можна використовувати чудовий атрибут valign, який управляє вертикальним вирівнюванням вмістом рядків і елементів таблиці. Атрибут valign може набувати наступних значень:		У тегах tr і td також можна використовувати чудовий атрибут valign, який управляє вертикальним вирівнюванням вмістом рядків і елементів таблиці. Атрибут valign може набувати наступних значень:
−	'''top''' - вирівнює вміст по верхньому краю ячейки таблиці;	+	'''top''' - вирівнює вміст по верхньому краю комірки таблиці;
−	'''middle''' - вирівнює вміст посередині ячейки таблиці;	+	'''middle''' - вирівнює вміст посерединікомірки таблиці;
−	'''bottom''' - вирівнює вміст по нижньому краю ячейки таблиці.	+	'''bottom''' - вирівнює вміст по нижньому краю комірки таблиці.
		+
		+
		+	'''''Групування рядків і стовпців.'''''
		+
		+
		+	Для об'єднання рядків у групи призначені три тега. По-перше, рядки з комірками заголовка можна помістити в елемент thead. По-друге, завершальні рядки з «підсумковими» комірками - в елемент tfoot. Нарешті, всі інші рядки з даними групуються в одному або декількох елементах tbody. Таким чином ви можете сформувати необхідну вам кількість груп. Незважаючи на те, що рядки з tfoot будуть відображені останніми, розміщувати сам елемент tfoot можна як після останнього, так і перед першим елементом <body (після thead). В одній таблиці може бути тільки по одному елементу thead і tfoot, і будь-яку кількість tbody.
		+	Якщо ви використовуєте thead або tfoot, то повинні використовувати і tbody. Причому в кожній з груп обов'язково повинна бути хоча б один рядок tr, і не повинно бути рядків поза груп.
		+	Для групування стовпців застосовується порожній тег <col /> і парний <colgroup>. На відміну від елементів, групуються рядки, ці теги розміщуються відразу після елемента caption або, якщо його немає, за відкриваючим тегом <table>. Вони не включають в себе комірки, а лише вказують на поєднувані стовпці. Обидва тега підтримують атрибут span, значенням якого є кількість групуємих стовпців. Якщо span не вказаний, то він вважається рівним одиниці.

---

Версія за 18:03, 24 грудня 2012

У HTML є потужний інструмент відображення інформації, структурованої у вигляді таблиць. Для цього передбачено десяток структурних тегів. Найпростіша таблиця складається з елемента table, що включає по одному або кілька елементів tr, th і td.

Якщо необхідно відобразити опис таблиці, то його можна помістити в елемент caption, наявний відразу за відкриваючим тегом . Далі послідовно розташовуються рядка таблиці, що позначаються тегом tr. Кожен рядок містить в собі комірку th або td, формуючи таким чином стовпці таблиці. Елементи th позначають комірки з заголовками стовпців або рядків. Вміст їх за замовчуванням відображається браузерами жирним накресленням і центрується. Тег td ж призначений для всіх інших комірок з даними. Наявність заголовків th не є обов'язковим, але в таблиці повинна бути хоча б один рядок з однією коміркою. За допомогою атрибуту border елемента tableможна визначити, чи будуть комірки таблиці обведені рамкою чи ні. Таблиці в HTML є одним з найнеобхідніших елементів і самими універсальними засобами форматування картинок і тексту. Є, звичайно, і альтернативні способи, такі як шари наприклад, але це громіздко, тяжко і незручно ... Справа в тому, що всяка бродилка бачить шари по своєму, і для більш менш пристойного відображення шарів необхідно писати довгий і нудний скрипт, та й той не панацея ... У той час, як таблиці, хоч у деяких нюансах нерідко і розходяться, але розбіжність-то мінімально. Створюються таблиці тегом table із закриваючим тегом /table. Вміст таблиці формується порядково, а кожен рядок формується послідовно з елементів таблиці. Рядки таблиці створюються тегом tr, (/tr). Елементи таблиці створюються тегом td(/td). Атрибут border задає ширину рамки таблиці в пікселях. Атрибут width в тегу table задає ширину таблиці, величина може задаватися або в пікселях, або у відсотках від ширини вікна браузеру. Атрибут height в тегу table задає висоту таблиці, величина може задаватися або в пікселях, або у відсотках від висоти вікна браузеру. Атрибут align вирівнює таблицю по лівому краю, по центру і по правому краю вікна браузеру наступними значеннями, відповідно: left, center і right. Атрибут cellpadding визначає, на яку відстань вміст клітинки відступатиме від кордону клітинки. Зазвичай цей атрибут встановлюють рівним нулю, а відступи роблять за допомогою засобів CSS. Атрибут cellspacing задає відстань між кордонами елементів таблиці. Досить часто цей атрибут встановлюють рівним нулю. Атрибут bordercolor визначає колір рамки таблиці. Атрибут bgcolor задає колір фону таблиці. colspan - використовується для об'єднання сусідніх клітинки що знаходяться в одному рядку таблиці. rowspan - використовується для об'єднання сусідніх клітинок що знаходяться в одному стовпці таблиці. Атрибут width в тегу td задає ширину поточного ячейки або в пікселях, або у відсотках від загальної ширини таблиці. У тегах tr, і td, також можна використовувати атрибут align, але на відміну від тега table, дія атрибуту в цьому тегу поширюватиметься на вміст клітинок рядка або однієї клітинки - вона управлятиме вирівнюванням вмісту. Атрибут align в цьому випадку може набувати наступних значень: left - вирівнює вміст по лівому краю елементу таблиці (використовується за умовчанням); center - вирівнює вміст по центру елементу таблиці; right - вирівнює вміст по правому краю елементу таблиці; justify - вирівнює вміст абзацу по обох краях елементу таблиці (підтримується не всіма браузерами). У тегах tr і td також можна використовувати чудовий атрибут valign, який управляє вертикальним вирівнюванням вмістом рядків і елементів таблиці. Атрибут valign може набувати наступних значень: top - вирівнює вміст по верхньому краю комірки таблиці; middle - вирівнює вміст посерединікомірки таблиці; bottom - вирівнює вміст по нижньому краю комірки таблиці. Групування рядків і стовпців. Для об'єднання рядків у групи призначені три тега. По-перше, рядки з комірками заголовка можна помістити в елемент thead. По-друге, завершальні рядки з «підсумковими» комірками - в елемент tfoot. Нарешті, всі інші рядки з даними групуються в одному або декількох елементах tbody. Таким чином ви можете сформувати необхідну вам кількість груп. Незважаючи на те, що рядки з tfoot будуть відображені останніми, розміщувати сам елемент tfoot можна як після останнього, так і перед першим елементом <body (після thead). В одній таблиці може бути тільки по одному елементу thead і tfoot, і будь-яку кількість tbody. Якщо ви використовуєте thead або tfoot, то повинні використовувати і tbody. Причому в кожній з груп обов'язково повинна бути хоча б один рядок tr, і не повинно бути рядків поза груп. Для групування стовпців застосовується порожній тег <col /> і парний <colgroup>. На відміну від елементів, групуються рядки, ці теги розміщуються відразу після елемента caption або, якщо його немає, за відкриваючим тегом . Вони не включають в себе комірки, а лише вказують на поєднувані стовпці. Обидва тега підтримують атрибут span, значенням якого є кількість групуємих стовпців. Якщо span не вказаний, то він вважається рівним одиниці.