Как сделать блок стрелкой?

Question

[LOBBY GIRL]

Вечер в хату! Как лучше реализовать вот такие переходы у блоков? Страница должны быть адаптивной, соответственнно и угол у блока тоже. Спасибо!

Answer 1

[Иван Сергеев]

Можно попробовать сделать два абсолютно спозиционированных блока, и применить к ним свойство transform (повернуть на нужный угол), чтобы точка их соприкосновения стала углом.
Ну или более простой вариант - вставить изображение угла img

Comments

[Кирилл]

Уголок на свг сделать и вставить. Ну или просто картинкой)

[LOBBY GIRL]

Кирилл Кубляков: во общем проще угол с картинокой в png вставить?

[Иван Сергеев]

да, и с адаптивностью будет проще - 100% ширины задать

[Кирилл]

Павел Горбунов: Ага, Иван правильно сказал.

Answer 2

[Алексей]

Обычные же треугольники на CSS через псевдоэлементы, зачем картинки?

Answer 3

[Александр]

Вам помогут геометрические фигуры, в данном случае - треугольник https://m.habrahabr.ru/post/126207/

Answer 4

[WQP]

Самый лучший способ это - https://www.viget.com/articles/angled-edges-with-c...