От автора: как насчет классического трюка CSS! Это даже и не трюк, поскольку нумерованный список CSS может быть сделан с помощью counter-increment и counter-reset, и это идеально нам подходит. Я просто хотел удостовериться, что вы знаете, как это работает, и у вас есть простые примеры для копирования.
Скажем, все, что вы хотите сделать, это изменить стиль номеров:
Вот пример со страницы CodePen Challenges:
На днях на Pen появилось такое демо, в которой использованы довольно классные стили:
Сайты рецептов — отличное места для поиска стилей пользовательских списков, поскольку списки этапов — это одна из основных их функций. На сайте Мета Маркиза у него есть забавные варианты. Я взял его CSS и переместил сюда:
Обязательно ознакомьтесь с небольшим изменением медиа-запросов. Конечно же, на сайте рецептов Леи Веру также есть интересная нумерация.
Вот интересная демо-версия Джонатана Снука, которая имеет «временную шкалу» и использует пользовательские счетчики для обозначения каждого раздела:
Автор: Chris Coyier
Источник: //css-tricks.com/
Редакция: Команда webformyself.
