@kingdomofcrooked
Дизайнер

Как вырезать уголки у блока div?

Привет. Хотел узнать можно ли методом css вырезать уголки в блоке div, как показано на рисунке? Или для такого варианта подойдет только старый способ с картинками?

1322ed653a154e628d4ab46fc662e717.jpg
  • Вопрос задан
  • 2511 просмотров
Решения вопроса 2
@tef
Через радиальный градиент.
jsfiddle.net/z3my1cfg
Ответ написан
@soledar10
html css3 js jquery
Пригласить эксперта
Ответы на вопрос 2
lazalu68
@lazalu68
Salmon
Есть такая фишка - border-corner-shape, правда ее кажется все-таки выпилили из спек. Вот Lea Verou рассказывает о ней. А вот демка тоже от Lea Verou, в коде увидите, как у нее через SVG реализованы эти уголки.

Вот тут тоже чувак спрашивает как сделать уголки, через border-corner-shape, ему отвечают что этого пока нет в спеках и предлагают рабочие варианты )
Ответ написан
Комментировать
paulradzkov
@paulradzkov
Дизайнер, верстальщик, начальник отдела UI
Можно сделать через border-image: картинка цвета фона с прозрачными сегментами в уголках. И с помощью border-image-outset отрегулировать соприкосновение бордера и фона.
Это «новый» способ, но всё же с картинками.
Ответ написан
Комментировать
Ваш ответ на вопрос

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

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