使用偏斜的css在rgba红色，绿色，蓝色，alpha中留下了alpha 0.8的间隙

问题描述

我正在使用css偏斜在文本属性中创建一个具有透明背景颜色的角度。

我在.cut-corner之前添加了高度61％，在.cut-corner：之后添加了高度39％
我将偏斜效果应用于.cut-corner：之后，当我应用背景色background：rgba（241，243，244，0.8）;

这在如何填充它上还留有一个小空白。

html code:-
<p class="cut-corner filled">
                    Stay in the moment. Make every customer matter.
</p>

css:-

p {
            background: none;
            Box-shadow: none;
            margin: 0;
            padding: 0;
            color: @color-primary;
            z-index:2;
            @media @medium {
                color: #fff;
               font-size: 40px;
                font-weight: bold;               
                text-transform: capitalize;
                letter-spacing: 3px;               
                max-width:50%;
                margin-bottom: 10px;
                display: inline-block;               
                padding:30px 50px 30px 40px;               
            }
        }

.cut-corner{
position: relative;
overflow: hidden;
           
}
.cut-corner:after,.cut-corner:before{
  position: absolute;
  content: '';
  width: calc(100%);
  left: 0px;
  z-index: -1;
  background: rgba(241,243,244,0.8);
}
.cut-corner:before {
 height: calc(61%);;
 top: 0px; 
            
}


.cut-corner:after {
  height: calc(39%);
  bottom: 0px;
  transform: skew(120deg);
 
}

注意：-如果增加.cut-corner：在高度增加80％之前，它会填满间隙，但这会导致颜色重叠，因此无法采用这种方法

1> .cut-corner：之前为高度61％

2> .cut-corner：高度为80％之前：-无法采用这种方法

解决方法

暂无找到可以解决该程序问题的有效方法，小编努力寻找整理中！

如果你已经找到好的解决方法，欢迎将解决方案带上本链接一起发送给小编。

小编邮箱:dio#foxmail.com (将#修改为@）

html jquery skew