Css 以相反的方式倾斜背景

我从来没有觉得问这样的问题这么傻。。。但事情是这样的

我已经创造了一个歪斜的作品魅力，看到这里

。倾斜bg{
背景：#E7ADBB；
填充：200px0；
变换：倾斜（0度，-7度）；
利润上限：-200px；
z指数：0；
颜色：白色；
}
.歪斜磅{
填充底部：50px！重要；
}
.内容{
变换：倾斜（0度，7度）；
文本对齐：居中；
}

你需要知道的一切。。。
它不起作用的原因是倾斜（ax，ay）。如果您只是简单地反转角度，您将更改x轴，而不是y轴。所以用一个相反的角度来代替7度变为-7度

阅读有关歪斜的文章

这样做：


。倾斜bg{
背景：#E7ADBB；
填充：200px0；
变换：倾斜（0度，7度）；
利润上限：-200px；
z指数：0；
颜色：白色；
}
.歪斜磅{
填充底部：50px！重要；
}
.内容{
变换：倾斜（0度，-7度）；
文本对齐：居中；
}

你需要知道的一切。。。
将倾斜中的-7改为7
对于内容，将其翻转，使其像这样倾斜（0度，-7度）


。倾斜bg{
背景：#E7ADBB；
填充：200px0；
变换：倾斜（0度，7度）；
利润上限：-200px；
z指数：0；
颜色：白色；
}
.歪斜磅{
填充底部：50px！重要；
}
.内容{
变换：倾斜（0度，-7度）；
文本对齐：居中；
}

你需要知道的一切。。。
下面是一个示例，说明如何使用
：before
选择器实现相同的结果。减少筑巢


.container{
文本对齐：居中；
高度：300px；
宽度：900px；
位置：相对位置；
溢出：隐藏；
保证金：0自动；
}
.货柜：在{
内容：“；
位置：绝对位置；
背景：darkOrange；
身高：100%；
宽度：200%；
变换：旋转（15度）；
前-35%；
左-25%；
z指数：-1；
}
h1{
z指数：1；
颜色：白色；
宽度：100%；
线高：120px；
文本对齐：居中；
}

埃克斯马普