list-style
Суммирующее свойство, позволяющее одной строкой присвоить значения всем трём нижеуказанным свойствам. Либо нескольким из них. Значения этих свойств просто перечисляются через пробел, порядок следования не важен. Синтаксис свойства:
list-style: list-style-type || list-style-position || list-style-image
Пример:
<ul style="list-style:square inside">
<li>элемент 1
<li>элемент 2<br>2-ая строка элемента 2
</ul>
|
|
- элемент 1
- элемент 2
2-ая строка элемента 2
|
а)
list-style-image
Позволяет использовать в качестве маркера какой-либо рисунок, адрес которого указывается в скобках после слова url
(т.е. list-style-image: url(адрес); ). Относительные адреса указываются относительно расположения таблицы стилей, а не HTML-документа. Также можно присвоить значение
none (по умолчанию).
Пример:
<ul style="list-style-image: url(smallpic.gif)">
<li>элемент 1
<li>элемент 2
</ul>
|
|
|
в)
list-style-type
Определяет тип маркера в списке или его отдельном элементе. При этом не имеет значения, является список нумерованным или маркированным. Возможные значения:
- disc - диск (по умолчанию для ul, но при условии, что данный список не вложен в другой список)
- circle - окружность
- square - квадрат
- decimal - арабские цифры (по умолчанию для ol)
- lower-roman - римские цифры в нижнем регистре
- upper-roman - римские цифры в верхнем регистре
- lower-alpha - строчные латинские буквы
- upper-alpha - прописные латинские буквы
- none - без маркера
Пример:
<ol style="list-style-type:lower-alpha">
<li>элемент 1
<li>элемент 2
<li style="list-style-type:disc">элемент 3
</ol>
|
|
- элемент 1
- элемент 2
- элемент 3
|
(disc - англ. круг, диск
circle - англ. круг, окружность
square - англ. квадрат
decimal - англ. десятичный
lower - англ. нижний, низший
upper - англ. верхний, высший
roman - англ. римский
none - англ. никакой)