Добавил:
Upload Опубликованный материал нарушает ваши авторские права? Сообщите нам.
Вуз: Предмет: Файл:
Методичка по WEB-дизайну1(последняя).docx
Скачиваний:
0
Добавлен:
01.07.2025
Размер:
2.77 Mб
Скачать
        1. Неупорядоченный список

Иначе неупорядоченный список называется маркированным и создается в HTML с использованием тега <ul> (англ. «unordered list»). Каждый элемент маркированного списка обозначается тегом <li>.

<ul>

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

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

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

</ul>

В программе Aptana Studio 3 достаточно набрать ul>li*3 и нажать Сtrl+E.

В окне браузера это выглядит следующим образом:

  • 1 элемент списка

  • 2 элемент списка

  • 3 элемент списка

Используя атрибут type, HTML предлагает следующие маркеры для списка:

disс - стандартно используемый круг или, в некоторых браузерах, ромб;

circle - контур круга или ромба;

square - закрашенный прямоугольник.

Пример:

<ul>

<li type="сiгсlе">1 элемент списка <li>

<li type="disc">2 элемент списка </li>

<li type="square">3 элемент списка </li>

</ul>

В браузере это будет выглядеть следующим образом:

  • 1 элемент списка

  • 2 элемент списка

  • 3 элемент списка

        1. Упорядоченный список

Иначе упорядоченный список называется нумерованным и создается в HTML с использованием тега <ol> (англ. «ordered list»). Каждый элемент списка, как и элемент нумерованного списка обозначается тегом <li>.

<ol>

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

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

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

</ol>

В браузере это будет выглядеть следующим образом:

  1. 1 элемент списка

  2. 2 элемент списка

  3. 3 элемент списка

У нумерованного списка можно изменить вид нумерации. Для этого служит атрибут tуре, который принимает следующие значения:

type ="1" - нумерует арабскими цифрами (это стандартное значение);

type ="a" - нумерует строчными буквами;

type ="A" - нумерует заглавными буквами;

type ="i" - нумерует маленькими римскими цифрами;

type ="I" - нумерует заглавными римскими цифрами.

Атрибут start в теге <о1> указывает, с какой цифры начинается список. Если нужно определить новую стартовую точку для элементов списка нужно использовать атрибут value в теге <li>.

В следующем примере использованы все три возможности:

<ol start="10">

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

<li type="a" value="18">2 элемент списка</li>

<li type="I" value="10">3 элемент списка</li>

</ol>

В браузере это будет выглядеть следующим образом:

  1. 1 элемент списка

  1. 2 элемент списка

  1. 3 элемент списка

        1. Многоуровневый список

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

Списки вкладываются друг в друга следующим образом: сначала нужно создать список первого уровня, а затем внутрь любого элемента этого списка, между тегами <li> и </li>, добавить список второго уровня:

<ol>

<li>1 элемент списка

<ul>

<li>1 элемент вложенного списка</li>

<li>2 элемент вложенного списка</li>

</ul>

</li>

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

</ol>

Выглядит это следующим образом:

  1. 1 элемент списка

  • 1 элемент вложенного списка

  • 2 элемент вложенного списка

  1. 2 элемент списка

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

Список определений имеет особые вставки, но не содержит ни маркеров списка, ни нумерации. Список определений создаётся с помощью трёх тегов:

<dl> обозначает сам список определений;

<dt> обозначает термин;

<dd> обозначает определение термина.

Теги <dt> и <dd> пишутся парами внутри <dl>.

Например:

<dl>

<dt>Термин</dt>

<dd>Определение</dd>

<dt>Второй термин</dt>

<dd>И его определение</dd>

</dl>