Markup Language - Image Replacement

Click here to return to the 123WORDPRESS.COM HTML Tutorial section. To view the CSS tutorial, please click here.
Above: Markup language - assigning CSS styles to text . Chapter 14 Image Replacement As more designers and developers start using standards (especially CSS), new techniques are discovered every day, and new and better ways to achieve the same goals are constantly being developed.
"Image replacement" is arguably the best example of this change, a technique that uses CSS to replace ordinary text with images. How should you use CSS to replace text with images?
It is best to put all presentational (trivial or decorative) images in CSS, because this allows easy replacement of updated images without changing the markup. Also, we can be sure that all browsers and devices will interpret the markup correctly, regardless of whether there is advanced CSS that fully supports replacing text with images. This advantage is emphasized throughout this book. No Perfect Solution However, finding the "perfect" way to replace text with images using only CSS is almost like finding the Holy Grail... because it doesn't exist yet. There are only methods that work in all browsers, but they don't work with assistive technologies (such as screen readers). There are other methods that work, unless the user instructs the browser not to display any images, but enables CSS.
Although there is no method that can satisfy everyone (or all users) at the time of writing this article, there are indeed many websites using this method. You must be particularly careful when applying any image replacement method, and you must also understand the side effects it will bring. It can be used, but be careful. This is the purpose of this chapter. When the convenience brought by image replacement is revealed, its shortcomings will also be exposed. As time goes by, perhaps more CSS enthusiasts will find better ways to achieve the same effect; until then, we must make good use of the techniques and weigh the pros and cons.
To familiarize you with the concept of image replacement, let's look at some common methods. Let's start with the Fahrner Image Replacement (FIR) technique.

Previous Page 1 2 3 4 5 6 7 Next Page Read Full Article

<<: Detailed explanation of MySQL data grouping

>>: JS realizes special effects of web page navigation bar