Как поперек вставить картинки?

Question

[Игорь]

То есть в фотошопе могу нарезать,а в вебе непосредственно как сделать?

дайте примеры такой реализации ,пожалуйста

Answer 1

[hscode]

Попробуй сразу после блока который нужно перекрыть создать новый блок с такими стилями
height: 200px;
background: gray;
display: inline-block;
width: 100%;
transform: skewY(8deg);
z-index: 1111;

А потом после него добавить свой контент.
Ну или сделай угловой бардюр.
Полюбому придется повозиться с position:absolute;

Comments

[Игорь]

joxi.ru/brRQ0oLf4weqA1

а вот с этими стыками как быть?

[hscode]

Дай ссылку, в вебинспекторе сделаю и скину

[Игорь]

https://clck.ru/9p8NU

[hscode]

prntscr.com/amrmk9 пойдет так ?

[hscode]

классу second_wrapper стиль такой
position: relative;
top: -140px;
z-index: 11111;

между классом first_section и second_wrapper добавить свой див со стилями
display: inline-block;
transform: skewY(10deg);
height: 350px;
background: #FFFEFE;
width: 100%;
position: absolute;
margin-top: -220px;

Это все быстрый пример, надеюсь на его основе получится сделать что вам нужно

[Игорь]

hscode: а если я вставлю в блок с девушками бакграунд там ничо не полетит?

[hscode]

background придется ставить в двух блоках. все равно придется повозиться

[Игорь]

hscode: спасибо)

[Игорь]

hscode: joxi.ru/Y2LKNoysdw86m6
и самый такой геморный момент.
как для фотки прописать такой угловой фон?

в первом случае было легко мы просто прописывали белый фон,а здесь картинка...