It is more complicated than just HTML and CAS, you will need JavaScript/JQuery too. I had a quick play around, and got this to work. You should create a function called InitUserInterface, and put this code in it. I had done a similar thing in Twine (not simple there either), and had some images to try it with. All the images are PNGs, and the higher ones obviously need transparent regions. They are all the same size too.
JS.eval ("$('<div id=\"imagediv\" />').insertBefore('#status');")
JS.eval ("$('#imagediv').html('<img src=\"" + GetFileURL("mbase.png") + "\" id=\"image1\" /><img src=\"" + GetFileURL("m_red_cape.png") + "\" id=\"image2\" /><img src=\"" + GetFileURL("m_green_uw.png") + "\" id=\"image3\" />')")
JS.eval ("$('#image1').css('position', 'fixed')")
JS.eval ("$('#image1').css('top', '0px')")
JS.eval ("$('#image1').css('left', '0px')")
JS.eval ("$('#image2').css('position', 'fixed')")
JS.eval ("$('#image2').css('top', '0px')")
JS.eval ("$('#image2').css('left', '0px')")
JS.eval ("$('#image3').css('position', 'fixed')")
JS.eval ("$('#image3').css('top', '0px')")
JS.eval ("$('#image3').css('left', '0px')")
The first line creates a new HTML DIV element, into which the images will go.
The second line puts content into that DIV, specifically three images. Each image is grabbed using the GetFileURL function, and the bottom image must be first. Each image is given its own "id"; image1, image2, image3.
The remaining lines set CSS properties on each image, setting the position to absolute, and placing each in the top left corner. As each is positioned at the same place, they go over each other.