如何在 CSS 中创建此形状

Question

已经花了好几个星期试图找到如何制作这个形状，它需要只是这个形状，希望有一些没有叠加的东西让它看起来像这个形状，而只是倾斜矩形。

Answer 1

#parallelogram {
  margin: 0 auto;
 width: 50%;
 height: 100px;
 -webkit-transform: skew(-30deg);
    -moz-transform: skew(-30deg);
      -o-transform: skew(-30deg);
            transform: skew(-30deg);
 background: blue;
}

<div id="parallelogram">
</div>

Answer 2

#shape {
  width: 300px;
  height: 75px;
  background-color: blue;
  -webkit-transform: skew(-30deg);
 -moz-transform: skew(-30deg);
 -o-transform: skew(-30deg);
  transform: skew(-30deg);
  margin: auto;
}

<div id="shape"></div>

如何在 CSS 中创建此形状

How does one create this shape in CSS

css

css-shapes