NooBiToo
@NooBiToo

Как сделать такие вырезы и бордер?

Доброго времени суток.
Подскажите как можно сделать такие вырезы, что бы можно было использовать бордер который будет так же повторять форму вырезов, пробов через заливку градиентом с такими вырезами, но бордер увы, с псевдоэлементами тоже самое
5e83793e28114675389005.png

p.s. извините за качество картинки, такый дизигнер(
  • Вопрос задан
  • 180 просмотров
Решения вопроса 2
sfi0zy
@sfi0zy Куратор тега CSS
UI developer. Верстаю неверстаемое.
С помощью градиентов можно нарисовать все, что угодно:

Ну и обычными картинками тоже можно, через border-image или так же, через фоны.
Ответ написан
sniggering_deus
@sniggering_deus Куратор тега CSS
I will live forever in the flame of your eyes.
Для подобных ситуаций хорошо подходит SVG:



Пример конечно не идеален, так как углы и пространство немного не доведены до идеала, но как основа для размышлений подходит отлично. Раньше мне казалось что всё такое нужно делать с помощью CSS, но начиная с того момента как я научился работать с SVG - мои мысли и отношение к верстке подобных вещей изменилось.

Конечно можно сделать с градиентами, тенями, border-image, clip-path и прочими свойствами, но на мой взгляд SVG проще и лучше. ИМХО.
Ответ написан
Пригласить эксперта
Ваш ответ на вопрос

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

Войти через центр авторизации
Похожие вопросы