Wie Hintergrund mit unterschiedlichen Farben auf jedem Abschnitt Skew

Question

So etwas wie dies ich suche zu erreichen: https://preview.ibb.co/fRidmR/example.jpg

So ziemlich jede Farbe ein anderes div.Can es mit nur CSS geschehen ist? Ich habe ein paar Dinge mit transform: skew versucht, aber kann nicht herausfinden, wie man das eine, das ich sein möchte, über das andere und auch die erste kommt in das vorherige Element jedes Mal.Ich versuchte mit Minus-Rand und mehr Polsterung, aber ich will es ansprechen und es sieht nicht so gut aus. Bitte helfen. Danke im Voraus.

Answer 1

Beste, was ich von IS denken kann, eine Reihe von verschachtelten divs haben könnte, die jeweils mit einem grafischen Hintergrund, der einen transparenten Bereich den Hintergrund der div zu zeigen, hat es in verschachtelt ist.

So würde der HTML-Code sein dies wie:

<div id='grey_bg'> 
<div id='red_skew'> 
<div id='black_skew'> 
</div> 
</div> 
</div> 

und haben dann die CSS-Code wie folgt:

#grey_bg{background: grey;} 
#red_skew{background-image:url(red_skew.png);} 
#black_skew{background-image:url(black_skew.png);} 

Ansonsten nur ein einziges bg Bild für das Element haben.