@dudeone
пока ничего не умею

Снова вопрос по меню с косыми линиями(параллеограмм), как реализовать такой эффект с помощью псевдоэлементов?

Всем доброго вечера, заранее извиняюсь за вопрос, поиск как по гуглу, так и по сайту ничего дельного не дал(.
Необходимо реализовать меню с косыми линиями при наведении (параллеограмм) и сделать это нужно с помощью псевдоэлементов, а для первого и последнего пункта нужен с одного края прямой угол(как на скрине)

5da33b13273dc152686075.png

п.с. overflow: hidden при skew - не катит, так же как и заливка фоном... необходимо именно реализовать с помощью :before и :after.

https://codepen.io/Samokhin/pen/GRRoXZj

спасибо за помощь.
  • Вопрос задан
  • 94 просмотра
Решения вопроса 2
Samuello
@Samuello
Учусь WEB программированию.
@maximrabotaet
https://codepen.io/Smiky/pen/dyyGqQp
Еще вместо трансформации можете использовать svg с preserveAspectRatio="none" с background-size: 100% 100%; для псевдо-элементов
Ответ написан
Пригласить эксперта
Ваш ответ на вопрос

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

Войти через центр авторизации
Похожие вопросы
SPIKS Санкт-Петербург
от 70 000 до 90 000 ₽
move2usajobs.com LLC Лос-Анджелес
от 2 000 до 4 000 $
PERX Нижний Новгород
До 50 000 ₽