The basic idea is that instead of an image in the html you supply text content in the html but replace the text content with a background image instead. Typically this is done for logos or headers where a company (or site) name is actually a stylised text image and for accessibility (and seo) it would make a little more sense to have the details as text content in the html instead.
If you have a site that has a logo image that says "ABC TRADING - The best widgets you can get" then instead of using a foreground image in the html you can put that actual text into the html and then use an image replacement technique to provide the original stylised image as a background image. This means that screenreaders may read the text more easily than looking at the alt text in an image and if images are turned off or missing then you still have the text in the html showing whereas not all browsers will show the alt text correctly if the image is missing or you get the broken image icon showing and messing the page up.
Whether or not it is better to have the image in the html or not it still does make it easier to manage the layout if you have that image in the background and controlled via css.
You would not do this for all images of course but only images that are used in place of text content such as graphical headings that have very stylised text that can't be produced in a browser so the author has created an image. In these cases you can use an image replacement technique instead.
I typically use it for logos and site names but rarely use it anywhere else in the page.
On the other hand I don't see a big drawback to having the actual image in the html as long as the alt attribute content is descriptive enough and you don't mind that some browsers may not show the alt content if the image is missing - or they just show the horrible missing image icon and square outlined box.
In the end it's just another tool in the box to use when you think fit.