Самоучитель по HTML

Справочник HTML

Язык HTML позволяет создавать различные списки и перечисления при помощи тегов <UL>, <OL> и <DL>. Сами элементы отмечаются тегом <LI> в первых двух случаях и тегами <DT>, <DD> в последнем, где допускаются вложенные списки любой глубины.

Давайте рассмотрим пример ненумерованного списка созданного при помощи тегов <UL> и <LI>:


      <UL type="square">
         <LI> это первая строка
         <LI> это вторая строка
         <LI> это третья
         <LI> четвёртая
         <LI> пятая
         <LI> и так далее...
      </UL>

Выглядеть это будет вот так:

это первая строка
это вторая строка
это третья
четвёртая
пятая
и так далее...

Атрибут type="..." задаёт вид ненумерованного списка. Со значением, как в данном случае, "square", мы получаем список, пронумерованный с помощью квадратиков, со значением "disc" он будет нумероваться с помощью чёрных кружков, значение же "circle" даст нам тоже кружки, но уже выколотые. Если же в теге <UL> не указывать атрибут type="...", то по умолчанию будет задано значение "disc".

Чтобы создать нумерованный список, используют теги <OL> и <LI>.

Например:


      <OL type="A">
         <LI> это первая строка
         <LI> это вторая строка
         <LI> это третья
         <LI> четвёртая
         <LI> пятая
         <LI> и так далее...
      </OL>

Смотрим, что из этого получается:

это первая строка
это вторая строка
это третья
четвёртая
пятая
и так далее...

Так как в атрибуте type="..." было указано значение "A", то нумерация осуществлялась при помощи больших латинских букв. Также могут быть использованы другие значения:

a - используются маленькие латинские буквы;
I - используются большие римские цифры;
i - используются маленькие римские цифры;
1 - используются арабские цифры.

Атрибут start="..." указывает с какой по счёту буквы или цифры следует начинать список.

Например:


      <OL type="A" start="3">
         <LI> это первая строка
         <LI> это вторая строка
         <LI> это третья
         <LI> четвёртая
         <LI> пятая
         <LI> и так далее...
      </OL>

Смотрим, что из этого получается:

это первая строка
это вторая строка
это третья
четвёртая
пятая
и так далее...

Также можно создать список определений. Он будет перечислять не только пункты, но и даст их описания. Такой список заключается в контейнер тегов <DL>...</DL>. Пункты заключаются в контейнере <DT>...</DT>, а его описание в контейнере <DD>...</DD>.

Давайте рассмотрим пример:


      <DL>
         <DT>Первый пункт</DT>
         <DD>Его описание</DD>

         <DT>Второй пункт</DT>
         <DD>Его описание</DD>

         <DT>Третий пункт</DT>
         <DD>Его описание</DD>
      </DL>

Из этого HTML-кода получается следующий список:

Первый пункт

Его описание

Второй пункт

Его описание

Третий пункт

Его описание

А теперь давайте рассмотрим пример вложенного списка:


      <UL>
         <LI>Книга первая
         <UL>
            <LI>Первая часть первой книги
               <OL type="a">
                  <LI>Глава первая
                  <LI>Глава вторая
                  <LI>Глава третья
               </OL>
            <LI>Вторая часть первой книги
            <LI>Третья часть первой книги
         </UL>
         <LI>Книга вторая
         <LI>Книга третья
      </UL>

Из этого получается следующее:

Книга первая

Первая часть первой книги

Глава первая
Глава вторая
Глава третья

Вторая часть первой книги
Третья часть первой книги

Книга вторая
Книга третья

Предыдущая страница Следующая страница

Вы можете свободно использовать фрагменты сайта, с условием размещения ссылки на наш сайт:
<a href="http://tri222.narod.ru"><b>Самоучитель по созданию Web-страниц.</b></a>

Хостинг от uCoz

Самоучитель по HTML

Справочник HTML

Оглавление:

CSS

Создание списков