How to subtract background from an image?

In CSS, how do I place an image directly above or below a background image?

• The body div of my website has a repeating background image.  I wish to create an effect of three-dimensionality by dropping a shadow from the bottom of the background image and adding a little structure to the top of the background image.  These “structure” images have already been created in Photoshop.  All I would like to do is place them directly above and below the body’s background image.  Can anyone suggest the proper CSS syntax to do this?

• Answer:

  Thanks, Alexander.  I’m afraid I should have been more specific. I attribute the confusion to the fact that I didn’t really know what I was doing.  My html is generated by php files, but I’m using WordPress, so I didn’t build the php myself.  I wanted to insert an image above a “content” div.  I wondered, “Do I need to create a new div and position it above #content?  Do I need to create a new class within #content and play with the “position” tag?”  It turns out I needed to do something like this: <?php get_header(); ?> <div id="content" class="col-full"> <img src="image.jpg"/> <div id="main" class="col-left"> I introduced the image within the #content div and then played around with the CSS: #main{width:600px; margin-left: 25px; margin-top: 20px; margin-bottom: 20px; } to get it positioned correctly.