Как сделать такие скошенные края у div?

Question

[Alli03]

Приветствую. Кто знает? Подскажите?! Как сделать такие скошенные края у div в низу? На картинке показано синими стрелками.
Буду очень благодарна за помощь :0)

Comments

[Zhainar]

:before :after элементы в виде трегуольников

Answer 1

[xmoonlight]

Правильный способ - пропустить картинку через css clip-path/clip-polygon:
https://www.smashingmagazine.com/2015/05/creating-...

Answer 2

[Денис Инешин]

Это можно сделать с помощью псевдоэлементов и трансформаций.
Примерно так: https://jsfiddle.net/IonDen/jyzmwkqy/
Один из уголков подсвечен красным, чтобы было понятно что произошло.

Answer 3

[Ivan Bogachev]

Можно с помощью одного псевдоэлемента и прозрачной границы - например так

Answer 4

[Павел Краснов]

А можно снизу просто бекграунд наложить в виде чёрных этих треугольников