Створення таблиць є дуже зручною функцією на персональному комп'ютері. Давайте сьогодні поговоримо про те, як навчитися створювати таблицю в HTML5, а також дізнаємося, як її параметри все вказати через стилі.
Завдання і її рішення
Для початку необхідно зрозуміти всю систему створення табличних параметрів і в принципі її структури. По суті своїй, як ви всі знаєте, таблиця у нас складається з двох частин. Якщо їх можна так назвати - рядки і стовпці, в яких також можуть розташовуватися окремі осередки. Тут також можуть розташовуватися різні написи і зображення, тому як таблиці можуть бути різними і створюються вони для різних цілей.
Якщо вам необхідно додати таблицю з рядків і стовпців на який-небудь сайт, вам доведеться скористатися тегом \u003ctable\u003e. Потрібно розуміти, що ця «деталь» по суті своїй. Виступаємо якимось контейнером для елементів, які, в свою чергу, і є визначником табличного змісту.
Потрібно також відзначити, що рядки, як і стовпці задаються теж тегами - \u003ctr\u003e і \u003ctd\u003e. Не варто забувати, що в будь-якому випадку, який би тип таблиці не була, в обов'язковому порядку в ній повинна бути хоча б єдиний осередок. Якщо, з якоїсь причини, вас не влаштував стандартний тег, тоді можете скористатися іншим, наприклад - \u003cth\u003e. Якщо саме цей варіант ви і вибрали, тоді будьте впевнені в тому, що відображатися він буде жирним шрифтом і до того ж, буде також автоматичне вирівнювання по самій комірці. Так відбувається в автоматичному режимі, і саме браузер так відображає дані параметри. Це єдина відмінність, яку ви зможете помітити в цьому випадку.
Осередки в таблиці, яка створюватиметься на сайті, буде виглядати наступним чином:
- в горизонтальному рядку з першої осередком розташуватися друга
- по вертикалі під першою осередком розташуватися третя
- поруч з третьої по горизонталі розташовується четверта ланка й т.д.
Якщо ви вирішите включити в таблицю такий елемент як border (для його створення знадобиться використання тега \u003ctable\u003e), то його потрібно буде використовувати виключно з порожнім значенням і ніяк по-іншому (значення дорівнюватиме одиниці). Навіть при бажанні, всі інші значення просто не пройдуть процес валідації.
Для того щоб користувачеві вдалося керувати полем, яке розташовується всередині осередку, необхідно буде скористатися такою властивістю як padding, яке відноситься до стильовим. Найчастіше це властивість йде в парі з селектором td.
У разі необхідності зміни відстані між осередками в таблиці, потрібно буде скористатися властивістю під назвою border-spacing. Саме його і необхідно буде додати до table.
Для того щоб скоротити або збільшити відстань меду осередками, також можна використовувати і рамку, яка знаходиться навколо кожного осередку.