HTML CSS examples for HTML Tag:a
The media attribute sets what media/device the linked document is optimized for.
This attribute can accept several values.
| Value | Description |
|---|---|
| and | Specifies an AND operator |
| not | Specifies a NOT operator |
| , | Specifies an OR operator |
| Value | Description |
|---|---|
| all | Default. Suitable for all devices |
| aural | Speech synthesizers |
| braille | Braille feedback devices |
| handheld | Handheld devices |
| projection | Projectors |
| Print preview mode/printed pages | |
| screen | Computer screens |
| tty | Teletypes and similar media using a fixed-pitch character grid |
| tv | Television type devices |
| Value | Description |
|---|---|
| width | width of display area. "min-" and "max-" prefixes can be used. Example: media="screen and (min-width:500px)" |
| height | height of display area. "min-" and "max-" prefixes can be used. Example: media="screen and (max-height:700px)" |
| device-width | width of the target area. "min-" and "max-" prefixes can be used. Example: media="screen and (device-width:500px)" |
| device-height | height of the target area. "min-" and "max-" prefixes can be used. Example: media="screen and (device-height:500px)" |
| orientation | orientation of the target area. Possible values: "portrait" or "landscape" Example: media="all and (orientation: landscape)" |
| aspect-ratio | width/height ratio. "min-" and "max-" prefixes can be used. Example: media="screen and (aspect-ratio:16/9)" |
| device-aspect-ratio | device-width/device-height ratio. "min-" and "max-" prefixes can be used. Example: media="screen and (aspect-ratio:16/9)" |
| color | bits per color. "min-" and "max-" prefixes can be used. Example: media="screen and (color:3)" |
| color-index | number of colors. "min-" and "max-" prefixes can be used. Example: media="screen and (min-color-index:256)" |
| monochrome | bits per pixel in a monochrome frame buffer. "min-" and "max-" prefixes can be used. Example: media="screen and (monochrome:2)" |
| resolution | pixel density (dpi or dpcm). "min-" and "max-" prefixes can be used. Example: media="print and (resolution:300dpi)" |
| scan | scanning method of a tv display. Possible values are "progressive" and "interlace". Example: media="tv and (scan:interlace)" |
| grid | if the output device is grid or bitmap. Possible values are "1" for grid, and "0" otherwise. Example: media="handheld and (grid:1)" |
A link with a media attribute:
<!DOCTYPE html> <html> <body> <p> <a href="" media="print and (resolution:300dpi)">Open media attribute page for print</a> </p><!-- w ww . j a va 2s . com--> </body> </html>