css实现边框灰色内部透明的三角形

可以通过CSS的伪元素和边框属性来实现边框灰色内部透明的三角形。以下是一个例子：

<div class="triangle"></div>

.triangle {
  width: 0;
  height: 0;
  border-top: 20px solid transparent;
  border-bottom: 20px solid transparent;
  border-right: 20px solid gray;
  position: relative;
}

.triangle::before {
  content: "";
  position: absolute;
  top: -20px;
  left: -20px;
  width: 0;
  height: 0;
  border-top: 20px solid transparent;
  border-bottom: 20px solid transparent;
  border-right: 20px solid white;
}

这个例子中，我们首先创建一个宽度和高度均为0的元素，并设置其上下边框和右边框的宽度为20px，颜色为灰色。接着，我们使用伪元素`::before`在三角形的左上角创建一个宽度和高度均为0的元素，并设置其上下边框和右边框的宽度为20px，颜色为白色。通过设置这个伪元素的位置，使其覆盖住了三角形的左上角，从而实现了内部透明的效果。