HTML and CSS Reference
You can browse the complete list of current Internet media types at
iana.org/assignments/media-types/ or refer to a shorter list of some of the most
common ones at wikipedia.org/wiki/Internet_media_type
You don't always need to declare the content type for every resource. That information is typically sent
automatically by the web server, or may even be embedded in the file itself. However, some types of files
may not be recognized automatically by every browser, and including the content type in a type attribute
can let the browser know what kind of data it can expect.
Although the type attribute's value is an “Internet media type,” you might prefer (as we do) to use the term
content type to avoid confusion—the term media type refers to something else entirely in CSS.
The Other Media Type (The media Attribute)
When the link element links to a style sheet, the optional media attribute can indicate the medium for
which that style sheet is intended. This means you can easily tailor your site's layout and design for
different media. For example, you could provide two separate style sheets, one for display on computer
screens and another for use when the page is printed:
<link rel="stylesheet" href="/css/screen-styles.css" media="screen" >
<link rel="stylesheet" href="/css/print-styles.css" media="print" >
You can also include multiple media types in a single media attribute, separated by commas:
<link rel="stylesheet" href="/css/screen-styles.css" media="screen,projection,tv" >
There are only a handful of media types you can use as the value of a media attribute:
all : suitable for all devices and media (this is the default, assumed if the media attribute is
braille : for Braille tactile feedback devices, such as refreshable Braille displays that output text
by mechanically raising small dots through holes in a flat surface.
embossed : for Braille printers that emboss Braille text into paper.
handheld : for handheld devices, typically with small screens, low resolution, and limited
bandwidth. The newer classes of smartphones and tablets still have small screens, but also
feature full-color displays of a higher resolution than the mobile phones and PDAs from just a few
years ago. Many modern mobile devices have much more sophisticated web browsers than their
predecessors, and are perfectly capable of displaying style sheets otherwise intended for desktop
screens, so they'll honor the screen media type and often ignore handheld style sheets.
print : for paged, printed material as well as documents viewed on screen in “print preview”
projection : for projected presentations.
screen : primarily for color computer screens, like you find with desktop and laptop computers.