给div加class属性，要求div样式为悬浮在element-plus的card组件的右上角的直角三角形

可以使用CSS的伪元素实现一个直角三角形，然后将该伪元素添加到div中，同时给div添加class属性，代码如下：

HTML代码：

<el-card class="card">
  <div class="triangle"></div>
</el-card>

CSS代码：

.card {
  position: relative;
}

.triangle {
  width: 0;
  height: 0;
  border-top: 20px solid transparent;
  border-right: 20px solid #333;
  border-bottom: 20px solid #333;
  border-left: none;
  position: absolute;
  top: -20px;
  right: -20px;
}

解释一下：

首先，我们将card组件设置为相对定位，这是为了让内部的div可以使用绝对定位。

然后，我们使用CSS的伪元素（::before或::after）来创建一个直角三角形。具体来说，我们将div的宽度和高度都设置为0，然后使用border属性来创建三角形的边框。在这里，我们将上边框设为透明，右边框和下边框设为黑色，左边框不设置，这样就可以得到一个直角三角形。

接下来，我们将div设置为绝对定位，并将其定位到卡片组件的右上角。由于我们使用的是相对定位，所以div的位置是相对于卡片组件的位置进行定位的。

最后，我们将div添加一个名为“triangle”的class属性，这样就可以将CSS样式应用到该div上了。