HTML <a> media properties
Examples
The following example demonstrates the use of media properties link:
try it"
Browser Support
All major browsers support media properties.
Definition and Usage
media attribute specifies the target URL is why the type of media / device optimized.
This attribute is used to specify the destination URL for a particular device (eg iPhone), speech or print media design.
The property can accept multiple values.
It can only be used when href attribute is present.
Differences between HTML 4.01 and HTML5
This attribute is new in HTML5 attributes.
grammar
Possible operator
| Operators | description |
|---|---|
| and | Provisions of the AND operator. |
| not | Provision NOT operator. |
| , | Provisions of the OR operator. |
equipment
| value | description |
|---|---|
| all | default. Suitable for all devices. |
| aural | Speech synthesizer. |
| braille | Braille feedback devices. |
| handheld | Handheld devices (small screen, limited bandwidth). |
| projection | Projector. |
| Print preview mode / printed pages. | |
| screen | Computer screen. |
| tty | Teletype and similar media using a monospaced character grid. |
| tv | Television type devices (low resolution, limited paging capability). |
value
| value | description |
|---|---|
| width | Predetermined target display width of the area. You can use "min-" and "max-" prefixes. Examples: media = "screen and (min-width: 500px)" |
| height | Predetermined target height of the display area. You can use "min-" and "max-" prefixes. Examples: media = "screen and (max-height: 700px)" |
| device-width | Provisions of the target display / paper width. You can use "min-" and "max-" prefixes. Examples: media = "screen and (device-width: 500px)" |
| device-height | Provisions of the target display / paper height. You can use "min-" and "max-" prefixes. Examples: media = "screen and (device-height: 500px)" |
| orientation | Provisions of the target display / paper orientation. Possible values: "portrait" or "landscape" Examples: media = "all and (orientation: landscape)" |
| aspect-ratio | Predetermined target display width / height ratio of the area. You can use "min-" and "max-" prefixes. Examples: media = "screen and (aspect-ratio: 16/9)" |
| device-aspect-ratio | Provisions of the target display / paper device-width / device-height ratio. You can use "min-" and "max-" prefixes. Examples: media = "screen and (aspect-ratio: 16/9)" |
| color | The stated objectives of the display bits per color. You can use "min-" and "max-" prefixes. Examples: media = "screen and (color: 3)" |
| color-index | A predetermined number of color target display can handle. You can use "min-" and "max-" prefixes. Examples: media = "screen and (min-color-index: 256)" |
| monochrome | Provisions monochrome frame buffer in bits per pixel. You can use "min-" and "max-" prefixes. Examples: media = "screen and (monochrome: 2)" |
| resolution | Provisions of the target display / paper pixel density (dpi or dpcm). You can use "min-" and "max-" prefixes. Examples: media = "print and (resolution: 300dpi)" |
| scan | Predetermined scanning method tv display. Possible values are: "progressive" and "interlace". Examples: media = "tv and (scan: interlace)" |
| grid | Predetermined output device is grid or bitmap. Possible values: "1" grid, "0" is the other. Examples: media = "handheld and (grid: 1)" |