Прозрачное фоновое изображение, с другим изображением на каждой странице

Question

Мне нужно иметь прозрачное фоновое изображение. С другим изображением на каждой странице. Я посмотрел на другие ответы здесь, и все они указали мне изображение на странице 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;  
} 

Но это применение прозрачности и размеров для всех других изображений на странице.

Answer 1

Я понял, я просто создал отдельные классы для фоновых изображений и изображений переднего плана.

HTML

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

CSS

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