Создадим простую 3d-надпись
1. Нам понадобится минимум html-разметки:
2. Подключим красивый шрифт и для позиционирования элемента с классом render добавим стили в body:
3. Для создания 3d-сцены CSS необходимо указать свойство perspective.
Если не указывать единицу измерения, то свойство будет считываться браузером по умолчанию, т.е. в пикселях. Также можно указать свойство perspective-origin, по умолчанию оно по центру объекта (т.е.: perspective-origin: 50% 50%):
4. Зададим начальные свойства для нашей 3D-надписи, немного повернём её по осям X и Y, добавим теней и эффект по наведению курсора:
И вуаля!!! 👻👻👻👻 Всё готово!
