Теги вывода списка ul, ol, li, атрибуты: list-style, list-style-type
QR код

Теги вывода списков ul , ol , li , атрибуты , значения , стили : list-style , list-style-type , list-style-position , list-style-image , disc , circle , square , decimal , decimal-leading-zero , lower-roman , upper-roman , lower-greek , lower-latin , upper-latin , armenian , georgian

Главная страница сайта .
srcsrc

Тег - ul , ol , li , list-style , list-style-type , list-style-position , list-style-image

inf

Теги вывода списков ul , ol , li

Пример маркированного списка :Пример нумерованного списка :
<ul>
<li>
первый</li>
<li>
второй</li>
<li>
третий</li>
<ul>
  • первый
  • второй
  • третий
<ol>
<li>
первый</li>
<li>
второй</li>
<li>
третий</li>
<ol>
  1. первый
  2. второй
  3. третий
По умолчанию для тега li применяется стили : type - disc , position - outside . Для маркированного списка применимы стили офрмления маркеров , как по внешнему виду так и по отступу слева . Так же в качестве маркеров применимы изображения . Маркерами нумерованного списка по умолчанию являются цифры .
Пример применения стилей list-style , list-style-type тега li
<li style="list-style: disc outside none;">
<li style="list-style-type: disc;">
Внешний вид маркированных списков по стилям list-style , list-style-type с названием стиля в списках , применение стиля list-style: none; отключает отображение меток списка .
  • disc
  • disc
  • disc
  • disc
  • circle
  • circle
  • circle
  • circle
  • square
  • square
  • square
  • square
  • decimal
  • decimal
  • decimal
  • decimal
  • decimal-leading-zero
  • decimal-leading-zero
  • decimal-leading-zero
  • decimal-leading-zero
  • lower-roman
  • lower-roman
  • lower-roman
  • lower-roman
  • upper-roman
  • upper-roman
  • upper-roman
  • upper-roman
  • lower-greek
  • lower-greek
  • lower-greek
  • lower-greek
  • lower-latin
  • lower-latin
  • lower-latin
  • lower-latin
  • upper-latin
  • upper-latin
  • upper-latin
  • upper-latin
  • armenian
  • armenian
  • armenian
  • armenian
  • georgian
  • georgian
  • georgian
  • georgian
Пример применения стилей list-style , list-style-type , list-style-position тега li
<li style="list-style: square outside none;">
<li style="list-style-type: square; list-style-position: outside;">
<li style="list-style: square inside none;">
<li style="list-style-type: square; list-style-position: inside;">
Внешний вид маркированных списков по стилям list-style , list-style-type , list-style-position
с названием стилей типа и позиции в списках
  • square / outside
  • square / outside
  • square / outside
  • square / outside
  • square / inside
  • square / inside
  • square / inside
  • square / inside
Стили позицирования outside , inside тега li отличаются величеной отступа пунктов списка от левой стороны элемента в котором прописан HTML списка .
Пример применения стилей list-style , list-style-image , list-style-position тега li
<li style="list-style: none inside url('exc.gif');"><li style=" list-style-position: inside; list-style-timage: url('exc.gif');">
Внешний вид маркированных списков по стилям list-style , list-style-image , list-style-position
с названием стилей позиции и изображения маркера в списках
  • none / inside / url('exc.gif')
  • none / inside / url('exc.gif')
  • none / inside / url('exc.gif')
  • none / inside / url('exc.gif')
  • inside / url('exc.gif')
  • inside / url('exc.gif')
  • inside / url('exc.gif')
  • inside / url('exc.gif')
В случае применения стиля outside с маркерами в виде изображений применение стиля list-style-position необязательно . Для каждого из пунктов списка возможно применение индивидуальных избражений .

Non-Commercial Use: Free Runettex_team_ESQ © 2009 - 2024 Хостинг от uCoz