CSS3 将矩形转换为梯形

Question

我有一个 100x5 的 div：

我需要使用matrix3d()或rotateX()和perspective将其转换为 30px 高的对称梯形，角度为 45°（见下文）。 角度应该正好是 45°

Answer 1

这似乎适用于 Chrome -

-webkit-transform: perspective(24px) rotateX(39deg) scale(0.6, 6.4);
transform: perspective(24px) rotateX(39deg) scale(0.6, 6.4);

不过，我的出发点是这篇文章。