Css 如何在内联圆上添加文本？

我有5个像这样的圆圈

我想在每个圆圈下面加一个小“标题”，如下所示

对于圆圈，我在Vuetify中使用了

v-avatar

组件，但我真的不知道如何添加标题，使其看起来像上一幅图像。这是我目前拥有的代码：

newvue({
el:“#应用程序”，
vuetify:新的vuetify（），
数据（）{
返回{
}
},
})

。深灰色文本{
颜色：#707070！重要；
}
.pf文本{
字体系列：“阿拉塔”，无衬线；
}

强度

您可以将

包装到具有弹性列的div中。然后将

display:flex

和

flex direction:row

应用于包装它们的div

P
电子数据处理
乙二胺四乙酸
edC
EdS

这是一个代码