Как сделать заголовок со скошеными углами?

Question

[Igor Roschak]

Здравствуйте, получил такой дизайн заголовков,
Подскажите пожалуйста как можно сделать это с помощью СSS ?

Answer 1

[Андрей Федоров]

Как-то так
codepen.io/aliencash/pen/eJrBEx
Правда с адаптивностью сложно. Точнее лень допиливать, давайте дальше сами...

зы: Ах черт, у вас еще тени... (((

Comments

[Igor Roschak]

Тени я знаю как сделать))) Мне нужно было узнать саму реализацию, спасибо большое.

Answer 2

[Stalker_RED]

Теоретически можно https://habrahabr.ru/post/126207/

Но проще, надежнее, доступнее для поддержки, а также легче для канала и браузера, сделать эту штуку вектором в SVG.

Answer 3

[Дмитрий Гавриленко]

Если нужно чисто css и html, то я бы заморочился с треугольниками.
Кстати, они не всегда должны быть полу квадратами.