Multiple image replacment

I am trying to replace all the <h2> tags on a website I am making,

the h2 tag is to display a header on each page so each image needs to be different for each h2 tag.

I tried to do this by assigning an class to the h2 tag as follows…

<style>

.h2_one {    background-image:url(images/about.png);
            background-repeat:no-repeat;
        }
        
.h2_two {    background-image:url(images/contactus1.png);            
            background-repeat:no-repeat;
        }

.h2_three { background-image:url(images/news.png); 
            background-repeat:no-repeat;
            }
            
.h2_four { background-image:url(images/news.png); 
            background-repeat:no-repeat;
            }
        
</style>
</head>

<body>
<h2 class="h2_one"></h2>
<h2 class="h2_two"></h2>
<h2 class="h2_three"></h2>
<h2 class="h2_four"></h2>

</body>
</html>

Class 1-3 work (they display in dreamweaver)but 4 doesn’t and when I test it in the browser it doesnt display anything??

anyone have any ideas how I can get this working?

Thanks :sigh: