@Manvel2342
Пользователь пока ничего не рассказал о тебе

Как сделать такую кнопку?

Как сделать такую кнопку?

63cad04784382988805798.png
  • Вопрос задан
  • 613 просмотров
Решения вопроса 1
SeaInside
@SeaInside
15 лет пилю все эти штуки
Жму руку дизайнеру, молодец, не как у всех.

Прямо так, как на скриншоте, на чистом CSS вряд ли получится, ибо левый нижний угол строго вертикальный, а вот правый... вообще с трудом такую фигуру представляю в реальности, поэтому вариант с трансформацией средствами браузера тут отпадает.

Изначально я не обратил внимания, что нижний край строго горизонтальный, и накидал такое как стартовую точку



Но когда заметил - понял, что так в принципе не выйдет сделать, на CSS нельзя "зафиксировать от трансформации" две стороны сразу.

Так что остаётся вариант с фоновой SVG-шкой, что по сути "фоновая картинка", либо вариант со вставкой этой SVG напрямую в кнопку (прям инлайном) и дальнейшие манипуляции с ней, если требуется адекватный ховер.

Делать лень, это нетрудно :)
Ответ написан
Пригласить эксперта
Ответы на вопрос 1
firedragon
@firedragon
Не джун-мидл-сеньор, а трус-балбес-бывалый.
svg

второй вариант магия css
что то типа трансформа и фильтров
Ответ написан
Комментировать
Ваш ответ на вопрос

Войдите, чтобы написать ответ

Похожие вопросы