У будь-яких НТМL-документах для покращення сприйняття тексту можна використовувати три види списків:
невпорядкований (маркований);
упорядкований (нумерований);
список визначень.
У невпорядкованому списку для виділення елементів використовуються певні позначки (крапки, квадрати тощо). Починається такий список із тегу <UL>, а закінчується — </UL>. Кожний елемент списку починається з тегу <LI>. Тег <UL> може мати атрибут TYPE, який визначає форму позначки. Цей атрибут набуває таких значень:
disk — зафарбоване коло;
circle — коло;
square — маленький чорний квадрат.
В упорядкованому списку всі елементи пронумеровані. Починається список із тегу <OL>, а закінчується — </OL>. Кожний елемент такого списку також починається з тегу <LI>. Тег <OL> може мати атрибут TYPE, який визначає тип нумерації. Цей атрибут набуває таких значень:
А — велика літера;
а — мала літера;
І — велика римська цифра;
і — мала римська цифра;
1 — арабська цифра.
У разі потреби за допомогою атрибута START можна задати відмінний від одиниці початковий номер елемента, наприклад <OL TYPE="I" START="5">.
Тип маркера вказується у відкриваючому тегу контейнера списку: <UL TYPE=SQUARE>. Спосіб нумерування елементів списку вказує атрибут тегу. Допускається довільне вкладення списків, наприклад, одним із пунктів нумерованого списку може бути ненумерований список (або ненумерований список може містити ненумерований список з іншими маркерами).
Зверніть увагу на те, що за допомогою тегу <BASEFONT> для всього документа призначено розмір шрифту 6, а за допомогою тегів <FONT> визначено колір шрифту для кожного елемента списку.
У найпростішій таблиці інформація розміщена у комірках, утворених у результаті поділу прямокутника на стовпці та рядки. Для створення таблиці використовують чотири елементи.
Таблицю описують за допомогою тегів <TABLE>...</TABLE>. Кожний рядок таблиці починається з тегу <TR> і закінчується тегом </TR>. Якщо рядок містить заголовки стовпців таблиці, то використовують теги <ТН> і </ТН>, якщо ж дані — то <TD> і </TD>.
У HTML-документах таблицю заповнюють зліва направо, комірку за коміркою, починаючи з лівого верхнього кута і закінчуючи правим нижнім.
За умовчанням таблиця має невидимі межі комірок. Для того щоб зробити їх видимими, використовують атрибут BORDER, який має цілочислове значення, що визначає товщину рамки в пікселах, наприклад <TABLE BORDER=5>.
У тегах <ТН> та <TD>: для:
для об'єднання рядків служить атрибут rowspan= " число рядків"
для об'єднання стовпців служить атрибут colspan=" число стовпців"
Увага! Під час роботи з комп'ютером дотримуйтеся вимог безпеки життєдіяльності та санітарно-гігієнічних норм.
На протязі кількох уроків ми з вами створюємо власний веб-сайт. На минулому уроці ви визначилися з темою вашого сайту, наповнили сторінку сайту текстом та зображеннями, додали гіперпосилання. Продовжуємо роботу над створенням сайту.
Завдання:
Додати на ваш сайт список (маркований або нумерований).
Додайте невелику таблицю (2х2 або 3х3), оформіть її на свій смак.
Поекспериментуйте з кольором фону таблиці, кольором тексту, тегами форматування тексту та надайте своїй сторінці якнайліпшого вигляду.
Приклади коду сторінки із таблицями та списками та їх відображення в браузері
Виконання практичного завдання
На протязі кількох уроків ми з вами створювали власний веб-сайт. На минулих уроках ви визначилися з темою вашого сайту, наповнили сторінку сайту текстом та зображеннями, додали гіперпосилання та інші елементи. Завершуємо роботу над створенням сайту. На вашому сайті мають бути такі елементи:
Текст
Три зображення
Гіперпосилання на сайт ( зовнішнє)
Список (на ваш вибір)
Таблиця (2х2 або 2х3)