Чертёж шестой: Списки и отступы
В отличие от таблиц, без которых трудно построить серьёзную страничку, списки не являются такой уж неотъемлемой частью web-дизайна. НО! Умение работать со списками значительно экономит наше время при создании web-страничек, а сами списки и сформированные на их основе отступы придают страничке хорошую «читаемость» и особую выразительность. Так что, назвался web-мастером — изучай списки!
- Оформим на главной страничке в виде списка перечисление того, что мы любим:
- открой файл index.html;
- измени в нём строки:
… <P><FONT size="+1">Я учусь в 9 классе 11 школы города Иркутска. <P>Я люблю <OL> <LI>информатику <LI>рисовать <LI>своих друзей: <UL> <LI>четвероногих <LI>пернатых </UL> </OL> <P>А друзья мои — это… …
Тег <OL> задаёт нумерованный список, его атрибут type указывает способ нумерации и может иметь значения 1, A, a, I, i.
Тег <UL> — ненумерованный (маркированный) список, у него тоже есть атрибут type, принимающий значения disk, circle, square.
Тег <LI> указывает очередной элемент списка, можно считать, что он обозначает место, куда помещается номер элемента (цифровой или буквенный) или «пулька» (маркер списка, тот самый кружок или квадратик).
Как ты уже, конечно, заметил, тег <LI> можно не закрывать, а вот теги <OL> и <UL> закрывать надо обязательно, иначе весь последующий текст будет печататься с отступом. Это свойство списочных тегов применяется для задания абзацных отступов. Надо просто записать необходимое количество тегов <UL> — и весь последующий текст будет «сдвинутым». «Задвигается» же текст обратно закрывающим тегом </UL>.
- Задание: поэкспериментируй с атрибутом type, разберись, что означают его значения для нумерованных и маркированных списков.
- Задание: оформи список твоих друзей.
