Основы работы с XHTML и CSS


Неупорядоченные списки


Неупорядоченный список является последовательностью элементов, перед которыми стоит символ маркера, отделяемой от окружающего текста пустыми строками. Список выводится через один интервал и с отступом от левого края. Пример вывода неупорядоченного списка в браузере показан в листинге 2.15.

  • Элемент списка 1 · Элемент списка 2 · Элемент списка 3

    Листинг 2.15. Вывод в браузере неупорядоченного списка (html, txt)

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

<ul> <li>элемент списка</li> <li>элемент списка</li> ... </ul>

Листинг 2.16. Общая форма неупорядоченного списка (html, txt)

Например, маркированный список, показанный выше в листинге 2.15, задается следующим кодом.

<ul> <li> Элемент списка 1</li> <li> Элемент списка 2</li> <li> Элемент списка 3</li> </ul>

Листинг 2.17. Код неупорядоченного списка (html, txt)

Элементы списка выводятся через один интервал и содержат в начале символ маркера. Если текст элемента списка не умещается по ширине страницы, то он переносится по словам и делается отступ за символ маркера. Элементы могут заключаться в теги <p> (или между элементами могут вставляться теги <br/>), чтобы увеличить строчный интервал между элементами. Следующий список, например, обрамляет элементы списка тегами <p>, чтобы создать дополнительные пустые строки между записями. Вывод браузера показан в листинге 2.19.

<ul> <li><p>Это первый элемент списка. Текст, идущий после символа маркера, переносится по словам внутри маркера. Теги параграфа используются для вставки пустых строк между элементами списка.</p></li>

<li><p>Это второй элемент списка. Текст, идущий после символа маркера, переносится по словам внутри маркера. Теги параграфа используются для вставки пустых строк между элементами списка.</p></li> </ul>

Листинг 2.18. Код неупорядоченного списка параграфов текста (html, txt)

  • Это первый элемент списка. Текст, идущий после символа маркера, переносится по словам внутри маркера. Теги параграфа используются для вставки пустых строк между элементами списка.

    · Это второй элемент списка. Текст, идущий после символа маркера, переносится по словам внутри маркера. Теги параграфа используются для вставки пустых строк между элементами списка.

    Листинг 2.19. Вывод в браузере неупорядоченного списка параграфов текста (html, txt)




Начало  Назад  Вперед