如何复制此示例中的倾斜 div？答案

【问题标题】：how can I replicate the slanted divs in this example?如何复制此示例中的倾斜 div？
【发布时间】：2014-08-23 01:40:39
【问题描述】：

我以为我可以使用 transform css 属性，但它并没有完全满足我的需求。有没有人对此有任何见解？我真的是编码新手！

谢谢！

html:

<div class="about">
            <div class="aboutcontent">

            </div>
        </div>

scss:

.about {
  width: 100%;
  background: white;
  transform: skewY(-5deg);
  padding: 150px;
  .aboutcontent {
    transform: skewY(5deg);
  }
}

【问题讨论】：

因为这只是一个图像而不是一个实际的 HTML 页面，没有人能可靠地告诉你他们是如何在那里做到的......它可以 f.e.只是具有那些“角度”已经“内置”的背景图像......
是的，但是有一种方法可以在 html/css 中对此进行编码，我想知道如何做到这一点。
这样更清楚吗？我希望它看起来像图片。有谁有任何有用的 cmets 吗？

标签： styling

【解决方案1】：

我找到了答案！我上面的代码实际上是正确的。为了使我的网站看起来像示例，您应该在 body 上放置一个背景图片，然后您可以适当地定位 skewY div！

【讨论】：