Шаг 8 - Оформление документа (списки)

Для окончания темы "оформление документа" нам осталось рассмотреть еще пару элементов. Это списки и их типы.

Ненумерованные списки

В html есть два, вернее три вида списков, и первый это ненумерованный. Называется так от того, что каждый элемент списка выделяется не своим порядковым номером, а просто жирной точкой или квадратом. Ну вы все сами увидите.

Ограничивающими скобками для ненумерованного списка являются <ul>...</ul>, внутри которых он собственно и размещается. Каждый элемент списка, дабы его отделить от остальных, ограничивается скобками <li>...</li> (list item). Для краткости закрывающую метку можно не использовать.

Пример:

<ul>
 <li>Первый элемент списка
 <li>Второй элемент списка</li>
</ul>

Вот как выглядит:

Если вам не нравится оформление точкой, то вы можете задать другое начертание атрибутом type, который может принимать значение disc, square и circle.

Пример:

<ul type=square>
<li>1 element
<li type=disc>2 element
<li type=circle>3 element
<li>4 element
</ul>
И вот как это выглядит: Для более компактного расположения элементов списка существует атрибут COMPACT.

Нумерованные списки

Эти списки позволяют вам пронумеровать каждый элемент, причем это может делаться обычными и римскими цифрами, а также буквами.

Ограничивающие скобки для таких списков <ol>...</ol>. Атрибут type задает как раз тип нумерации:

  1. type=1 задает тип нумерации арабскими цифрами 1,2,3,...
  2. type=a задает тип нумерации латинскими буквами a,b,c,...
  3. type=A задает тип нумерации латинскими заглавными буквами A,B,C,...
  4. type=i задает тип нумерации римскими цифрами в нижнем регистре i,ii,iii,iv,...
  5. type=I соответственно римскими цифрами в верхнем регистре I,II,III,IV,...

Здесь также можно применять атрибут COMPACT.

Списки могут иметь более сложную структуру, т.е. быть вложенными. В таких случаях браузеры сами меняют тип нумерации списков, чтобы они различались.

Списки определений

Эти списки отличаются от двух предыдущих по своех структуре и организации. Используются для описания определений и терминов.
<dl>
<dt>Teрмин 1<dd>Определение первого термина.
<dt>Teрмин 2<dd>Определение второго термина.
</dl>
Вот как выглядит:
Teрмин 1
Определение первого термина.
Teрмин 2
Определение второго термина.
Здесь также может использоваться атрибут COMPACT.

В оформлении документов списки играют большую роль, так как в большинстве случаев на странице приходится очень много всего перечислять (ссылки, краткие оглавления, какие-то разновидности предметов и т.д.). Многие почему то предпочитают сами создавать оформление для списков, в виде шариков, стрелок, каких-то точек под стиль своех страницы, но мне лично кажется особого стиля они не предают, а вот места "жрут" много, так как каждая лишняя картинка увеличивает размер файла на 15 и больше байт. Вы в праве решать, что вам использовать, и если вы думаете что время потраченное посетителями с лихвой оплатится хорошим оформлением, то флаг вам в руки :-).


Предыдущий Шаг | Следующий Шаг | Оглавление
Автор Кузин Андрей.