Adding Media Style Sheets
In this lesson, we learn how to add media style sheets to our webpage.
We'll cover the following...
Media-dependent style sheets use exactly the same syntax as any other CSS declarations. When attaching an external style sheet to your page, the media attribute of the <link>
tag lets you specify the media type.
This sample shows how you can add three style sheets to your web page:
<link rel="stylesheet" href="allStyle.css" /><link rel="stylesheet" media="screen, projection, handheld, tv"href="screenStyle.css" /><link rel="stylesheet" media="print"href="printStyle.css" />
The first <link>
tag loads a CSS file that contains all style rules that are suitable for every media type. The second and third <link>
tags target specific media types, the second targets devices with screens, and the third targets printing devices.
Using the media attribute, you can attach the same style sheet file to different media types. This method cannot work with internal style sheets, because there is no media ...