Html 在img图标后面应用css背景

我试图在导入到项目中的img图标后面应用css背景。当尝试这样做时，我应用的css背景完全覆盖了图像。我试图将图像设置在背景的顶部，使其具有边框外观

我试图调整z指数，但没有效果。我还尝试使用添加一个伪类，但它没有显示我应用的css背景色

我怎样才能做到这一点

以下是一些代码示例：

img{
高度：32px；
宽度：32px；
z指数：500；
}
.背景{
宽度：40px；
高度：40px；
背景：蓝色；
不透明度：0.08；
边界半径：8px；
}

img{
高度：32px；
宽度：32px；
z指数：500；
位置：绝对位置；
左：12px；
顶部：12px；
}
.背景{
宽度：40px；
高度：40px；
背景：蓝色；
不透明度：0.08；
边界半径：8px；
位置：绝对位置；
}

img{
高度：32px；
宽度：32px；
z指数：500；
位置：绝对位置；
左：12px；
顶部：12px；
}
.背景{
宽度：40px；
高度：40px；
背景：蓝色；
不透明度：0.08；
边界半径：8px；
位置：绝对位置；
}

实际上你甚至可以跳过

位置：绝对。background

。实际上，您甚至可以跳过

位置：绝对背景
。