css - 在图片上添加叠加

Question

我想转换一个 div 以将其应用到面板前。

position: absolute;
font-size: 28px;
top: 203px;
left: 149px;
width: 661px;
height: 384px;
-webkit-transform: skewY(4.1deg) rotate(1deg);
background-color: red;

但是在右下角，div 没有填充到背景中。

要正确设置它的 css 属性是什么？

Answer 1

您可以将 skewX 添加到您的 css。我试过了，几乎填满了形状:

    position: absolute;
    font-size: 28px;
    top: 203px;
    left: 149px;
    width: 641px;
    height: 354px;
    -webkit-transform: skewY(4.1deg) rotate(1deg) skewX(2deg);
    background-color: red;