このような背景色を作成するには？

-9

私はあなたの助けが必要です。バックグラウンドを使って、どのように写真のようなブロックを作ることができますか？ありがとうございました。このような背景色を作成するには？

高さ：970px; 幅：100％;

2017-09-25 Dos771

は、あなただけの色を必要としたり、ブロックを回転させますか？ – jack

これまでに何を試しましたか？これはそれほど難しいことではありません。 – Huelfe

私は回転ブロックが必要です。 – Dos771

私はあなたがlitterallyしたい形状を取得するためにCSSの形状の作成者を検索することができます原因あなたは多くの研究を自分で行うdidntは推測します。

-webkit-clip-path: polygon(0 11%, 100% 0%, 100% 88%, 0% 100%); 
clip-path: polygon(0 11%, 100% 0%, 100% 88%, 0% 100%);

2017-09-25 14:23:49 Granny

私はこの代替 - スキューのソリューションが好きです。 – jack

IEでclip-pathがサポートされていない –

@Ihazkode IEで動作する必要があると指定していないため、この質問は本当に重要ではありません。 – Granny

.container divは、heightとと提供され、skewYプロパティを持つdivです。

変換について詳しくはhereをご覧ください。

.content { 
 
    background-color: grey; 
 
    width: 100%; 
 
    height: 970px; 
 
    transform: skewY(-2deg); 
 
}

<div class="content"></div>

2017-09-25 14:23:13

答えて