Все сервисы Хабра
Сообщество IT-специалистов
Ответы на любые вопросы об IT
Профессиональное развитие в IT
Закрыть
Задать вопрос
chelnokov_a
@chelnokov_a
Вёрстка
Как верстается такой элемент?
Это верхнее меню. При наведении на пункт открывается подменю. Как сделать так, чтобы между основным пунктов и вложеным элементом был такой изгиб?
Вопрос задан
более трёх лет назад
1387 просмотров
9
комментариев
Подписаться
2
Простой
9
комментариев
Facebook
Вконтакте
Twitter
Lynatik001
@Lynatik001
а посмотреть исходный код на том сайте не судьба? Это же верстка, ее верстка(стили,js.html) отображается в коде.
Написано
более трёх лет назад
chelnokov_a
@chelnokov_a
Автор вопроса
Спасибо за отличный совет. Только, к сожалению, не судьба. Поскольку на скриншоте не сайт, а макет сайта.
Написано
более трёх лет назад
chelnokov_a
@chelnokov_a
Автор вопроса
Lynatik001
, Если у вас есть сайт где такое уже реализовано, поделитесь, пожалуйста, ссылкой. Буду очень признателен.
Написано
более трёх лет назад
Максим
@LenovoId
chelnokov_a
, а если картинку из psd взять и на фон поставить - вариант ?
Написано
более трёх лет назад
chelnokov_a
@chelnokov_a
Автор вопроса
Максим Ленский
, Думал об этом. Но хотелось бы избежать этого. Вижу самое оптимальное решение в clip path у псевдо элемента, но мало ли знатоки что-то более красивое предложат
Написано
более трёх лет назад
Максим
@LenovoId
chelnokov_a
, может быть svg или запариться с css - делов много тут
Написано
более трёх лет назад
Lord_Dantes
@Lord_Dantes
Вырезать изгиб в svg и выставить туда псевдо-элементом возможно?
Написано
более трёх лет назад
Максим
@LenovoId
chelnokov_a
, у меня такая порнография получилась
snippet
Написано
более трёх лет назад
Ankhena
@Ankhena
Куратор тега Вёрстка
Обычные скругления и псевдоэлемент с кусочком радиального градиента.
Это пример
https://jsfiddle.net/Ankhena/xjpefyq0/
от другого вопроса, но его достаточно для решения этой задачи.
Написано
более трёх лет назад
Решения вопроса
1
Ankhena
@Ankhena
Куратор тега Вёрстка
Нежно люблю верстку
snippet
В размеры сами поиграйте.
Ответ написан
более трёх лет назад
2
комментария
Нравится
8
2
комментария
Facebook
Вконтакте
Twitter
chelnokov_a
@chelnokov_a
Автор вопроса
Супер! То что надо. Большое спасибо, за уделенное время.
Написано
более трёх лет назад
Ankhena
@Ankhena
Куратор тега Вёрстка
chelnokov_a
, тогда отмечайте решением, раз то, что надо. Так и другим будет понятно.
Написано
более трёх лет назад
Пригласить эксперта
Ответы на вопрос
0
Ваш ответ на вопрос
Войдите, чтобы написать ответ
Войти через центр авторизации
Похожие вопросы
HTML
+3 ещё
Простой
Как решить задачу с четвертой картинкой, которая постоянно вываливается?
1 подписчик
20 мар.
168 просмотров
1
ответ
Вёрстка
Простой
Шрифт подключается криво, почему?
1 подписчик
14 мар.
75 просмотров
1
ответ
Вёрстка
Простой
Почему некорректно масштабирутся верстка в Windows 11 и Яндекс Браузере?
1 подписчик
06 мар.
132 просмотра
0
ответов
Вёрстка
Простой
На сайте очень много видео. Какие есть идеи в оптимизации?
1 подписчик
06 мар.
133 просмотра
1
ответ
JavaScript
+3 ещё
Средний
Как уменьшить масштаб блока в зависимости от размеров родителя?
1 подписчик
04 мар.
163 просмотра
2
ответа
Вёрстка
+1 ещё
Простой
Tailwind v4 как работать с контейнером?
1 подписчик
03 мар.
105 просмотров
1
ответ
CSS
+1 ещё
Простой
CSS как сделать div изображений ровно под наклоном друг за другом?
1 подписчик
28 февр.
140 просмотров
1
ответ
Вёрстка
+1 ещё
Простой
Как избавиться от панели навигации в браузере при добавлении закладки на экран домой?
2 подписчика
24 февр.
85 просмотров
1
ответ
Вёрстка
Простой
Как добавить оценку товара в карточке товара?
1 подписчик
22 февр.
54 просмотра
1
ответ
Вёрстка
Простой
Как сверстать такую кнопку?
1 подписчик
13 февр.
176 просмотров
0
ответов
Показать ещё
Загружается…
Вакансии с Хабр Карьеры
Дизайнер-верстальщик
TurboProject
от 50 000 ₽
Разработчик фронтенда на TypeScript Middle+ / Senior в аналитический стартап
ТОРГСТАТ
от 250 000 ₽
React разработчик
Мойдекс
от 40 000 ₽
Минуточку внимания
Войдите на сайт
Чтобы задать вопрос и получить на него квалифицированный ответ.
Войти через центр авторизации
Закрыть
Реклама