Здравствуйте, уважаемые посетители моего скромного блога для начинающих вебразработчиков и web мастеров ZametkiNaPolyah.ru. Продолжаем рубрику Заметки по HTML и ее раздел HTML теги. Данная публикация посвящена HTML тегу <li>. Описание тега <li>, атрибуты тега <li>, синтаксис тега <li>, пример использования тега <li>. Тег <li> относится к группе тегов HTML списков, тег <li> используется в нумерованных списках, в списках директорий, в маркированных списках, в списках меню, не используется только в списках определений.

HTML тег <li>. Описание <li>.

HTML тег <li> относится к тегам предназначенным для формирования HTML списков.

Тег <li> предназначен для создания пунктов списка или как их еще называют элементы списка. Тег <li> сам по себе бесполезен без тега <ul> или <ol>. Теги <li> и <ul> формируют так называемые неупорядоченные списки, чаще их называют маркированные списки. Теги <li> и <ol> формируют нумерованный список, второе название – упорядоченные списки.

HTML элемент <li> является блочным элементом, то есть, его ширина зависит от области, в которой он стоит, внутри элемента <li> могут располагаться как блочные, так и строчные элементы, благодаря чему можно формировать вложенные списки HTML. Обратите внимание, что элементы <ol> и <ul> являются блочными, но внутри этих элементов можно размещать только элементы <li>.

Тег <li>. Синтаксис тега <li>.

Закрывающий тег для <li> не обязателен, хоть он и является парным HTML тегом, но по правилам хорошего тона закрывающий тег должен быть написан обязательно.

[php]

<ul>

<li>Первый элемент</li>

<li>Второй элемент</li>

<li>Третий элемент</li>

</ul>

<ol>

<li>Раз</li>

<li>Два</li>

<li>Три</li>

</ol>

[/php]

Тег <li>. Атрибуты тега <li>.

Тег <li>, так же, как и любой другой тег из группы HTML списков, имеет атрибуты событий и универсальные HTML атрибуты. У тега <li> имеется два уникальных атрибута:

Атрибут type, с помощью атрибута type можно задать вид маркера, в случае с маркированным списком

Атрибут value, служит для изменения порядка нумерации, в случае с упорядоченным списком.

Теги HTML списков

В языке HTML имеется целая группа тегов предназначенных для формирования HTML списков.

Теги, формирующие HTML списки:

Тег <li>. Пример использования тега <li>.

[php]

<!DOCTYPE HTML PUBLIC «-//W3C//DTD HTML 4.01 Transitional//EN» «http://www.w3.org/TR/html4/loose.dtd»>
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8">
<title>Пример использования тега LI</title>
</head>
<body>
<ol type="I">
<li>Первый
<ol type="i" start="50">
<li>1.1</li>
<li>1.2</li>
<li>1.3</li>
<li>1.4</li>
</ol>
</li>
<li>Второй
<ol reversed type="A">
<li>2.1</li>
<li>2.2</li>
<li>2.3</li>
</ol>
</li>

</ol>
</body>
</html>

[/php]

Если вы скопируете пример в текстовый редактор(рекомендую Notepad++, бесплатный редактор с подсветкой синтаксиса), а затем запустите его в браузере, то увидите:

Нумерованный HTML список. Пример использования тега <li>

На этом всё, спасибо за внимание, надеюсь, что был хоть чем-то полезен и до скорых встреч на страницах блога для начинающих вебразработчиков и вебмастеров ZametkiNaPolyah.ru 

Возможно, эти записи вам покажутся интересными


Выберете удобный для себя способ, чтобы оставить комментарий

Leave a Comment

Ваш адрес email не будет опубликован. Обязательные поля помечены *

Loading Disqus Comments ...