Как правильно сверстать такой хидер?

Question

[Levin249]

Добрый день!
Подскажите, как правильно сверстать такой хидер, а точнее его центральную часть? С помощью шестиугольника на CSS или поместить изображение?

Comments

[Антон Шаманов]

А схема\набросок этого хидера где?

Answer 1

[Bogdan Odarchenko]

Если не нужно поддерживать древние браузеры то на css.

Answer 2

[Антон Шаманов]

Картинки универсальнее, css фигуры имеет смысл использовать если дизайн ориентирован под "чистый" css или нужны манипуляции с фигурами. Особого выигрыша в скорости нет.

Answer 3

[Александр]

Треугольник на CSS можете сгенерировать здесь cssarrowplease.com

Comments

[Антон Шаманов]

Он и без всяких сервисов строится элементарно, на крайний случай держать под рукой памятку habrahabr.ru/post/126207

Answer 4

[Богдан Духевич]

Все элементарно. Белая фигурка внутри - png (лучше с прозрачностью, вдруг цвет фона поменяется), треугольный выступ под ней - обычный css-треугольник, сделанный с помощью border. Александр выше Вам кинул пример, посмотрите как они генерируются, там все предельно просто.

Comments

[Levin249]

Спасибо, технику построения я знаю. Интересно было как правильно. Большинство использовали бы css - это и хотел выяснить.

Answer 5

[Александр Балашов]

Изображением кроссбраузерно будет