Html 透明背景图像，每页上有不同的图像

我需要一个透明的背景图像。每个页面上都有不同的图像。我已经看了这里的其他答案，所有的答案都让我在CSS页面中指定了一个不起作用的图像，因为它出现在所有页面上

这是我到目前为止所拥有的

#content 
{
padding: 15px 30px 0 0;
}

#main-content 
{
position: relative;
margin-left: 250px;
max-width: 600px;
}

#main-text
{
padding: 10px 15px 19px 15px;
z-index: 1;
position: relative;
}

img
{
    position: absolute;
    top: 0;    
    width: 100%;
    height: 100%;
    opacity: 0.1; 
    z-index: -1;    
}

---

但它将透明度和大小应用于页面上的所有其他图像

我明白了，我只是为背景图像和前景图像创建了单独的类

HTML

<img class = "background" src="Images/wheel.png" alt="wheel"/>

img.background
{
    position: absolute;
    top: 0;    
    width: 100%;
    height: 100%;
    opacity: 0.1; 
    z-index: -1;    
}