html - CSS3でDIV-Containerを変換する方法

Question

次の図のように、divコンテナを変換しようとしています。

左は黒く塗られた通常のdivコンテナです。右側は欲しいコンテナです。

css3でこれを解決する方法を知っていますか？css3の「Polygon」属性について何か読んだのですが、この属性が削除されたとも聞きました。

編集：コンテンツがボックス内にある場合、それはスクリーチされます-ボックスは「後ろに落ちる」ようなものです。

Answer 1

しばらく前に、css-tricks.comでこれに関する記事を見つけました。これはうまくいくかもしれません：

#trapezoid {
    border-bottom: 100px solid red;
    border-left: 50px solid transparent;
    border-right: 50px solid transparent;
    height: 0;
    width: 100px;
}

Answer 2

    #trapezoid { 
 border-bottom: 100px solid black;
 border-left: 50px solid transparent; 
 border-right: 50px solid transparent; 
 height: 0; width: 100px; }

その他の形状とトリックについては、こちらを確認してください