小编Eug*_*tch的帖子

我有半透明块的问题.主要问题是"块"元素与其伪元素(之前)之间的细线.这个问题出现在每个现代桌面浏览器中(Opera,Firefox,Chrome.虽然不了解Safari).代码如下:

HTML:

<div class="block"></div>

CSS:

.block{
  position: relative;
  width: 200px;
  height: 200px;
  margin-left: 100px;
  background-color: rgba(0, 0, 0, 0.5);
  transform: skewX(-21deg);
}
.block:before{
  content: '';
  display: block;
  position: absolute;
  top: 0;
  bottom: 0;
  left: 100%;
  width: 100px;
  height:200px;
  background-color: rgba(0, 0, 0, 0.5);
}

关于jsfiddle的例子:https://jsfiddle.net/Farmatique/xw877edw/

即使我将背景颜色不透明度设置为1,此问题仍然存在.

任何帮助/建议表示赞赏.