Для прикладу ми взяли український алфавіт, крім цього ми прив'язали посилання для кожної букви, завдяки чому вони будуть клікабельні. І так, давайте приступимо.
Крок 1. HTML
У розмітці немає нічого складного-букви поміщаємо в елемент span, але оскільки ми будемо використовувати самогенеріруемий контент, то скористаємося data-attribute.
Так само, ми використовуємо спеціальну сітковий систему, де букви помістимо в елементи списку. У кожного елемента буде спеціальний клас.
Крок 2. CSS
Починаємо з оформлення самій нижній частині. Застосовуємо спеціальні властивості для симуляції 3d: