Одна з найбільш складних речей в розмітці HTML-сторінки - таблиці. І проблема не в складності тегів, які, по суті, не так вже й важко запам'ятати, а в тому, що при написанні коду можна легко допустити помилки - забути прописати зайву рядок або елемент, вписати текст не туди, куди треба, і інші дрібниці . Причому чим більше таблиця, тим більше шанс помилитися.
В першу чергу слід накреслити майбутню таблицю на аркуші паперу, помітивши, що і в якій комірці у вас буде перебувати, а також зазначивши для себе основні параметри того чи іншого елемента.
Якщо ви хочете створити в HTML таблицю за допомогою спеціального коду, можна використовувати для цих цілей і звичайний блокнот або звичайний документ Word. Правда, тут вам доведеться попрацювати, так як писати код доведеться довго.
Таким чином, код таблиці 2х2 буде виглядати таким чином:
Параметри таблиць, рядків і осередків
Отже, базовий код ми розібрали. Тепер поговоримо про те, як поліпшити таблицю, зробити його яскравішим і привабливішим. Для цього потрібно знати основні параметри тегів. Вони прописуються всередині відкриває тега, при цьому після кожного параметра ставиться знак рівності, а потім прописується його значення, взяте в лапки. Наприклад, фон в таблиці HTML задається так:
.
Перерахуємо кілька основних параметрів, які будуть найбільш корисні для вас. Почнемо з самої таблиці.
Так, задати ширину кордону допоможе параметр border, який може приймати будь-яке числове значення. Колір кордону задає bordercolor. Загальний фон задає bgcolor.
Якщо ж ви хочете зробити фоном таблиці малюнок, використовуйте background, при цьому вам слід прописати URL малюнка.
Вирівняти вміст сторінки навколо таблиці допоможе параметр align, який може приймати значення left, center і right.
Задати заголовок допоможе парний тег
, який прописується відразу після відкриває тега
.
Трохи про параметри рядка. Колір осередків в рядку задається за допомогою bgcolor. Вирівнювання тексту по горизонталі можна зробити за допомогою параметра align (left, center або ж right), по вертикалі - valign (приймає значення top, middle або bottom).
Відносно осередку можна відзначити, що колір фону і фоновий малюнок задається для неї за допомогою тих же параметрів, що і для всієї таблиці. Вирівняти текст можна за допомогою параметрів align і valign.
Є й особливі параметри - colspan і rowspan. За допомогою першого можна задати кількість стовпців, на які буде сягати осередок. Другий же задає кількість рядків, на які ця група може сягати.
Ось і все найбільш корисні параметри.
Таблиця кольорів
Скажімо кілька слів про таку корисну річ, як таблиця кольорів. З її допомогою задається фон сторінки, колір тексту, посилань і інших елементів. Таблиця кольорів містить близько 216 кольорів і відтінків. Кожен з них має свій шістнадцятковий код.
Сам код починається зі знака решітки і містить три пари цифр або букв. Наприклад, зелений колір в таблиці має код # 007F0. Кожна пара позначає інтенсивність одного з трьох основних кольорів - червоного, зеленого і синього. Використовуючи таблицю, можна вибрати потрібний вам колір і задати його за допомогою коду.
У разі якщо у вас немає можливості скористатися таблицею, можна задати колір за допомогою його назви англійською мовою.
вміст
Для того щоб помістити текст або будь-яку іншу інформацію в клітинку (рядок), слід прописати її між двома тегами. наприклад:
ім'я
. В осередку відобразиться «Ім'я».
Помістити графічну інформацію і медіафайли можна за допомогою спеціальних тегів - ,
Наостанок дамо кілька корисних порад, які допоможуть вам швидко створити в HTML таблицю будь-якої складності.
