• Create BookmarkCreate Bookmark
  • Create Note or TagCreate Note or Tag
  • PrintPrint
Share this Page URL
Help

Revolution! > Image Replacement

Image Replacement

Leaving the normal text within the element, sitting on top of the background image is not always what’s wanted. Many of the Zen Garden designs replace elements like the various headers and hide the text.

In March 2003, Douglas Bowman published a technique on his site, Stopdesign (www.stopdesign.com/articles/replace_text), that allowed replacing a piece of text with a background image for the sake of nicer typography. The technique was later dubbed Fahrner Image Replacement (FIR) in honor of the first person to propose the technique, Todd Fahrner. The basic idea is simple: Surround the text with a span element, hide the text using the span tags somehow, and apply the background image to the element itself. Here is simple markup for this:


PREVIEW

                                                                          

Not a subscriber?

Start A Free Trial


  
  • Creative Edge
  • Create BookmarkCreate Bookmark
  • Create Note or TagCreate Note or Tag
  • PrintPrint