Предлагаем широкий спектр веб услуг по разработке,
поддержке и продвижению веб-сайтов.
Гарантируем качество и высокий уровень сдаваемых проектов.

Курсы валют ЦБ РФ, руб.
USD = 57.65
EURO = 69.07
GBP = 78.26
CAD = 46.95
100 JPY = 51.48
CNY = 87.45
AUD = 45.84
SGD = 42.79

В CSS нумерованный список может быть с латинскими и греческими буквами, также с цифрами вкл. римские. Но вот как сделать список с русскими буквами - а) б) в) г) д) е) и т.д. ? - читайте далее:

Это делается через стили CSS 3

HTML:

 

<ol class="cyrilic">
  <li>Первый</li>
  <li>Второй</li>
  <li>Третий</li>
</ol>

 

В данном случае можно использовать как и <ol> так и <ul> ведь нумерацию мы принудительно выставим сами с помощью псевдоэлемента ::before и свойства content. Но т.к. в каждой строке должна быть своя буква, используем псевдокласс :nth-child(1), в скобках пишем номер буквы.

CSS 3:

 

.cyrilic li:nth-child(1)::before { content: 'а)'; }
.cyrilic li:nth-child(2)::before { content: 'б)'; }
.cyrilic li:nth-child(3)::before { content: 'в)'; }
.cyrilic li:nth-child(4)::before { content: 'г)'; }
.cyrilic li:nth-child(5)::before { content: 'д)'; }
.cyrilic li:nth-child(6)::before { content: 'и)'; }
.cyrilic li:nth-child(7)::before { content: 'к)'; }
.cyrilic li:nth-child(8)::before { content: 'л)'; }

 

и т.д.

 

Преимущества

Плюсов у данного метода очень много,
1) можно использовать буквы любого алфавита и любые символы вкл. символы utf-8. Также мы сами решаем, включать в список буквы, такие как Ё и Й, или нет.
2) Вид нумерации и оформление букв устанавливается через CSS.
3) Список легко расширить по аналогии и сделать вложенные списки.
4) Можно сделать несколько списков разного вида и применять их в требуемых ситуациях или комбинировать между собой, написав этот код в css файл шаблона.

Поддержка браузеров

Эта технология CSS 3, поэтому старые браузеры вроде IE8 ее не поддерживают. Слава Богу, что уже не нужно писать отдельные строки под IE, а если что и отображается плохо, то это проблема юзера, который использует IE.
В Internet Explorer 9 это уже работает. В остальных нормальных браузерах все хорошо работает, так же как и в iPhone и Android системах.

 




скрыть

Есть вопросы или нужна консультация ?

Позвоните нам по тел. 8914-32-00-603