어떻게 그래서 나는 이런 식으로 뭔가를 달성하기 위해 찾고 있어요

Question

각 부분에 다른 색으로 배경을 왜곡하는? 나는 transform: skew으로 몇 가지 시도를 했었지만, 내가 다른 것 위에 있고 싶고 또한 첫 번째 요소가 매번 이전 요소에 들어간다는 것을 알아낼 수 없었다. 나는 마이너스 마진과 더 많은 패딩을 시도했지만, 반응이 좋기를 바라며 그렇게 좋아 보이지 않습니다. 제발 도와주세요. 미리 감사드립니다.

Answer 1

내가 중첩 된 div의 시리즈를 가질 수 IS 생각할 수있는 가장 좋은, 그것은 중첩 된 DIV의 배경을 보여주는 투명 영역이있는 그래픽 배경 각.

그래서 HTML 코드는 것 같은 :

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

다음은 CSS 코드과 같이 있습니다

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

그렇지 않으면, 단지 요소의 하나 BG 이미지를 가지고있다.