4. Styling Images and Links by Type

There’s hardly a page on the web that doesn’t have several links and images on it. Those links might target several different types of documents besides other web pages, such as PDFs or video files. Those images might be of several different types, like photos, illustrations, and charts. Styling images and links based on their unique type is quite possible without CSS3, but involves more time, work, and markup. New selectors in CSS3 allow you to target each link or image type individually in a more specific, streamlined way. Once again, CSS3 comes to the rescue to improve the efficiency of both your development habits and your pages.

What You’ll Learn

We’ll be adding icons to links based on their type, as well as styling photos differently than other types of images, using these CSS3 selectors: The “end of the value” ($) attribute selector The “somewhere in the value” (*) attribute selector