You want your webpage to look across multiple devices. The process is no where as daunting as it appear, with CSS level 2's support for media types being among the simple tools you can use to help make your site view-friendly across mediums

There are three ways to attach a media type to the style sheet, so our CSS is applied only when a particular media (ie: handheld) is used to view the page:

With the above declaration, "print.css" will only be applied to the page as it's printed (or viewed in Print Preview mode in your browser). You can add additional linked style sheets targeting other media types also. As a side note, for XML documents, the equivalent of the above will be:

The state's name is the "pseudo class" that defines how the HTML elements should appear, depending on which state it is in. Below is an example of changing the "link", "visited", and "hover" state. Note the order that are defined, as it is the proper ordering to make a functioning CSS link.

Imported style sheets used here has the advantage as it being conditionally downloaded, meaning the style sheet will only be downloaded if the devise matches that specified in the media attribute. In low bandwidth devices such as handheld, any savings in unnecessary bandwidth could significant. The disadvantage of this technique at present is  the lack of browser/device support relative to technique 1) above. .

You can see, whatever CSS declarations you wish be applied in case of "Projection" should be wrapped around in the @media block.

Below sample example of the @media Rule