如何从倾斜div的边界去除锯齿状

Question

我想扭曲边界div，但是边框看起来像是锯齿状或像素化，我也尝试使用-webkit-backface-visibility: hidden;，但它仍然是像素化的。

以下是我的代码：

＆＃13;

＆＃13;

div{
  border: 2px solid red;
  display: inline-block;
  padding: 20px;
  transform: skew(-10deg);
  -webkit-backface-visibility: hidden;
}

＆＃13;

<div>
  This Div Is Awesome
</div>

＆＃13;

＆＃13;

＆＃13;