Как разобратся в CSS изображения?

Question

[MixNik]

Есть пять html страниц и нужно сделать так что бы на каждой странице были разные фоновые картинки код в CSS такой

.background{
    
display: block;
 
 width: 100%;
    
height: 100%;
    
background: url(index.jpg);
    
position: fixed;
    
background-size: cover;
}

И на самих страницах вот такой код:
<div class="index"></div>
Пробовал клонировать код CSS дописывать к background если тут написанно картинка индекс то я и дописывал получалась так backgroundindex и в дивах на страницах тоже менял значение, но эффекта ноль((((
Пробовал в CSS тоже клонировать вот эту строку, заменяя index на другое значение, название картинки например, тоже эффекта ноль
background: url(index.jpg);

Подскажите где и что нужно, прописать или заменить что бы на всех страницах сайта был разный фон?

Answer 1

[shmatuan]

.page1 {
background: url(index.jpg);
}
.page2 {
background: url(index2.jpg);
}

<div class="background page1"> </div>

Answer 2

[profesor08]

<div class="background" style="background-image: url(bg.jpg)"></div>