css - 如何使用具有透明背景的 CSS 切割方框 Angular ？

Question

我想像这样使用 CSS 剪切框的左上角。

请记住背景是透明的。

Answer 1

与OriDrori's answer 几乎相同的解决方案但更灵活(如果您需要固定宽度的切 Angular )。

无论 .card width 和 height 是什么，这个渐变看起来都是一样的。

body {
  background: purple;
}

.card {
  width: 200px;
  height: 200px;
  background: linear-gradient(135deg, transparent 20px, white 20px);
}

<div class="card"></div>