Новые HTML уроки

HTML справочник

Еще уроки по HTML

HTML вложенные списки

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

HTML маркированный, нумерованный список, вложенные списки

HTML код и теги, определяющие HTML списки

Не стоит пренебрегать HTML списками. Умелое использование списков позволяет украсить дизайн любой интернет-страницы. Также их применение приветствуется поисковыми системами.

Процесс оптимизации сайтов для поисковиков (SEO) является неотъемлемой частью сайтостроения. Поисковой оптимизацией нужно будет заняться тогда, когда вы определитесь с тематикой вашего будущего сайта и займетесь непосредственно наполнением его контентом, но сначала как следует изучите HTML и CSS! В нашем деле последовательность имеет большое значение!

Содержание страницы про HTML списки

HTML маркированный список
HTML нумерованный список
HTML вложенные списки или многоуровневые
HTML списки определений

HTML маркированный список

Пример:

<title>Маркированный HTML список, теги</title>

          </head>

          <body>

          <ul>

          <li>Sony</li>

          <li>Asus</li>

          <li>Dell</li>

          </ul>

          </body>

          </html>

Результат:

Теги

<ul> </ul> – определяют маркированный HTML список.
<li> </li> – определяют элементы (пункты) маркированного HTML списка.

Определяем тип маркера для элементов маркированного HTML списка:

<title>HTML маркированный список</title>

          </head>

          <body>

          <ul type="square">

          <li>Sony</li>

          <li>Asus</li>

          <li>Dell</li>

          </ul>

          </body>

          </html>

Результат:

Атрибуты и значения

type="" – сообщает браузеру, что будет определен маркер для элементов HTML списка.
Значение square – определяет тип маркера HTML списка: закрашенный квадратик.

Определяем тип маркера для элементов маркированного списка:

<title>HTML списки, теги</title>

          </head>

          <body>

          <ul type="circle">

          <li>Sony</li>

          <li>Asus</li>

          <li>Dell</li>

          </ul>

          </body>

          </html>

Результат:

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

Пример:

<title>Нумерованный список в HTML</title>

          </head>

          <body>

          <ol>

          <li>Sony</li>

          <li>Asus</li>

          <li>Dell</li>

          </ol>

Теги <ol> </ol> определяют нумерованный HTML список.

Результат:

Пример 2:

<title>Нумерованный список в HTML, теги</title>

          </head>

          <body>

          <ol type="A">

          <li>Sony</li>

          <li>Asus</li>

          <li>Dell</li>

          </ol>

type="A" определяет в качестве маркера нумерованного списка большие буквы.

Результат:

Пример 3:

<title>Нумерованные HTML списки</title>

          </head>

          <body>

          <ol type="a">

          <li>Sony</li>

          <li>Asus</li>

          <li>Dell</li>

          </ol>

type="а" определяет в качестве маркера нумерованного HTML списка маленькие буквы.

Результат:

Пример с атрибутом start:

<title>HTML теги, определяющие нумерованные списки</title>

          </head>

          <body>

          <ol start="3">

          <li>Sony</li>

          <li>Asus</li>

          <li>Dell</li>

          </ol>

Результат:

Атрибут start="" определяет первый символ первого пункта нумерованного HTML списка.

HTML многоуровневые или вложенные списки

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

<title>HTML вложенные списки (многоуровневый)</title>

          </head>

          <body>

          <ul>

          <li>Америка</li>

          <li>Европа

            <ul>

            <li>Швеция</li>

            <li>Норвегия</li>

            <li>Финляндия</li>

            </ul>

          </li>

          <li>Азия</li>

          <li>Австралия</li>

          </ul>

Результат:

Америка
Европа
- Швеция
- Норвегия
- Финляндия
Азия
Австралия

Отсюда и название списка → вложенный или многоуровневый список.

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

Пример:

<title>HTML списки определений</title>

          </head>

          <body>

          <dl>

          <dt>HTML</dt>

          <dd>Гипертекстовый язык разметки</dd>

          <dt>CSS</dt>

          <dd>Каскадные таблицы стилей</dd>

          </dl>

Результат:

Нумерованные или упорядоченные списки в HTML

Рассмотрим теги

<dl> </dl> – определяют HTML списки определений.
<dt> </dt> – определяют определяемые термины.
<dd> </dd> – определяют опрeделения.

Автор проекта - Вася Митин | Дата публикации: Октябрь 2009 | Обновление: Ноябрь 2018

HTML ячейки Вложенные HTML списки, код список HTML код iframe