css带阴影的三角形

要创建带阴影的三角形，您可以使用CSS的伪元素和一些CSS技巧。以下是一种实现方法：

HTML：

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

CSS：

.triangle {
  width: 0;
  height: 0;
  border-left: 50px solid transparent;
  border-right: 50px solid transparent;
  border-bottom: 100px solid #000;
  position: relative;
}

.triangle::before {
  content: "";
  position: absolute;
  left: -50px;
  bottom: -10px;
  width: calc(100% + 100px);
  height: 10px;
  background-color: rgba(0, 0, 0, 0.3);
  filter: blur(10px);
}

在上述代码中，我们使用了一个`div`元素作为三角形的容器，并为其添加了一个类名`.triangle`。通过设置`border`属性来创建一个等腰三角形，并设置底边的颜色为黑色。

然后，我们使用伪元素`::before`来创建一个带阴影的矩形，它会覆盖住三角形的底部部分。通过设置`left`和`bottom`属性来定位矩形，并使用`calc()`函数计算它的宽度，以确保它完全覆盖住三角形。我们还可以使用`background-color`属性设置矩形的背景颜色，并通过`filter`属性给它添加模糊效果。

通过这种方法，您可以创建一个带阴影的三角形。您可以根据需要调整三角形的大小、颜色和阴影效果。