如何使用CSS3转换DIV-Container

Question

我尝试转换我的div容器，如下图所示。

左边是一个涂成黑色的普通div容器。在右边是我想要的容器。

你知道如何在css3中解决这个问题吗？我读了一些关于css3中“Polygon”属性的内容，但我也听说过这个属性被删除了。

编辑：当内容在框中时，它会被删除 - 该框就像“落在后面”。

Answer 1

我在css-tricks.com找到了article这一段时间。这可能有效：

#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; }

检查here以获取更多形状和技巧