HTML <link> charset Attribute
Example
The charset attribute indicates that the linked document is written in Japanese:
<link href=”domoarigato.htm” rel=”parent” charset=”ISO-2022-JP”>
Definition and Usage
The <link> charset attribute is not supported in HTML5.
The charset attribute specifies the character encoding of the linked document.
The default character-set for modern browsers is ISO-8859-1.
Syntax
<link charset=”character_set”>
Attribute Values
| Value | Description |
|---|---|
| character_set | The character encoding of the linked document.Common values:
In theory, any character encoding can be used, but no browser understands all of them. The more widely a character encoding is used, the better the chance that a browser will understand it. To view all available character encodings, go to our Character sets reference. |
HTML <link> type Attribute
Example
In the following example, the type attribute indicates that the linked document is an external style sheet:
<head>
<link rel=”stylesheet” type=”text/css” href=”theme.css”>
</head>
Definition and Usage
The type attribute specifies the Internet media type (formerly known as MIME type) of the linked document/resource.
This attribute is only used if the href attribute is set.
Syntax
<link type=”media_type”>
Attribute Values
| Value | Description |
|---|---|
| media_type | The Internet media type of the linked document. Look at IANA Media Types for a complete list of standard media types |
HTML <link> target Attribute
Example
In the following example, the linked document is loaded in a new window:
<head>
<link rel=”parent” href=”wildcats.htm” target=”_blank”>
</head>
Definition and Usage
The <link> target attribute is not supported in HTML5.
The target attribute specifies a window or a frame where the linked document is loaded.
Syntax
<link target=”_blank|_self|_parent|_top|framename“>
Attribute Values
| Value | Description |
|---|---|
| _blank | Load in a new window |
| _self | Load in the same frame as it was clicked |
| _parent | Load in the parent frameset |
| _top | Load in the full body of the window |
| framename | Load in a named frame |
HTML <link> sizes Attribute
Example
Icon with specified size:
<link rel=”icon” href=”demo_icon.gif” type=”image/gif” sizes=”16×16″>
Definition and Usage
The sizes attribute specifies the sizes of icons for visual media.
This attribute is only used if rel=”icon”.
Differences Between HTML 4.01 and HTML5
The sizes attribute is new in HTML5.
Syntax
<link sizes=”HeightxWidth|any”>
Attribute Values
| Value | Description |
|---|---|
| HeightxWidth | Specifies one or more sizes for the linked icon. The height and width values are separated by an “x” or “X”.Examples:
|
| any | Specifies that the icon is scalable (like an SVG image)Examples:
|
HTML <link> rev Attribute
Example
In the following example, the rev attribute indicates that the current document is the parent of the “wildcats.htm” page:
<head>
<link rev=”parent” href=”wildcats.htm”>
</head>
Definition and Usage
The <link> rev attribute is not supported in HTML5.
The rev attribute specifies the relationship between the linked document and the current document.
The rev attribute is the reverse of the rel attribute.
Syntax
<link rev=”value“>
Attribute Values
| Value | Description |
|---|---|
| alternate | An alternate version of the document (i.e. print page, translated or mirror) |
| stylesheet | An external style sheet for the document |
| start | The first document in a selection |
| next | The next document in a selection |
| prev | The previous document in a selection |
| contents | A table of contents for the document |
| index | An index for the document |
| glossary | A glossary (explanation) of words used in the document |
| copyright | A document containing copyright information |
| chapter | A chapter of the document |
| section | A section of the document |
| subsection | A subsection of the document |
| appendix | An appendix for the document |
| help | A help document |
| bookmark | A related document |
HTML <link> rel Attribute
Example
An external stylesheet:
<link rel=”stylesheet” type=”text/css” href=”theme.css”>
Definition and Usage
The required rel attribute specifies the relationship between the current document and the linked document/resource.
Differences Between HTML 4.01 and HTML5
Some HTML 4.01 values are removed from HTML5, and some new values are added to HTML5.
Syntax
<link rel=”value“>
Attribute Values
| Value | Description |
|---|---|
| alternate | Provides a link to an alternate version of the document (i.e. print page, translated or mirror). Example: <link rel=”alternate” type=”application/atom+xml” title=”W3Schools News” href=”/blog/news/atom”> |
| author | Provides a link to the author of the document |
| dns-prefetch | Specifies that the browser should preemptively perform DNS resolution for the target resource’s origin |
| help | Provides a link to a help document. Example: <link rel=”help” href=”/help/”> |
| icon | Imports an icon to represent the document. Example: <link rel=”icon” href=”/favicon.ico” type=”image/x-icon”> |
| license | Provides a link to copyright information for the document |
| next | Provides a link to the next document in the series |
| pingback | Provides the address of the pingback server that handles pingbacks to the current document |
| preconnect | Specifies that the browser should preemptively connect to the target resource’s origin. |
| prefetch | Specifies that the browser should preemptively fetch and cache the target resource as it is likely to be required for a follow-up navigation |
| preload | Specifies that the browser agent must preemptively fetch and cache the target resource for current navigation according to the destination given by the “as” attribute (and the priority associated with that destination). |
| prev | Indicates that the document is a part of a series, and that the previous document in the series is the referenced document |
| search | Provides a link to a resource that can be used to search through the current document and its related pages. |
| stylesheet | Imports a style sheet |
HTML <link> media Attribute
Example
Two different style sheets for two different media types (screen and print):
<head>
<link rel=”stylesheet” type=”text/css” href=”theme.css”>
<link rel=”stylesheet” type=”text/css” href=”print.css” media=”print”>
</head>
Definition and Usage
The media attribute specifies what media/device the target resource is optimized for.
This attribute is mostly used with CSS stylesheets to specify different styles for different media types.
The media attribute can accept several values.
Differences Between HTML 4.01 and HTML5
The media attribute now supports more values.
Syntax
<link media=”value“>
Possible Operators
| Value | Description |
|---|---|
| and | Specifies an AND operator |
| not | Specifies a NOT operator |
| , | Specifies an OR operator |
Devices
| Value | Description |
|---|---|
| all | Default. Used for all media type devices |
| Used for Print preview mode/printed pages | |
| screen | Used for computer screens, tablets, smart-phones etc. |
| speech | Used for screenreaders that “reads” the page out loud |
| aural | Deprecated. Speech synthesizers |
| braille | Deprecated. Braille feedback devices |
| handheld | Deprecated. Handheld devices (small screen, limited bandwidth) |
| projection | Deprecated. Projectors |
| tty | Deprecated. Teletypes and similar media using a fixed-pitch character grid |
| tv | Deprecated. Television type devices (low resolution, limited scroll ability) |
Values
| Value | Description |
|---|---|
| aspect-ratio | Specifies the width/height ratio of the targeted display area. “min-” and “max-” prefixes can be used. Example: media=”screen and (max-aspect-ratio:16/9)” |
| color | Specifies the bits per color of target display. “min-” and “max-” prefixes can be used. Example: media=”screen and (min-color:3)” |
| color-index | Specifies the number of colors the target display can handle. “min-” and “max-” prefixes can be used. Example: media=”screen and (min-color-index:256)” |
| device-aspect-ratio | Deprecated. Specifies the device-width/device-height ratio of the target display/paper. |
| device-width | Deprecated. Specifies the width of the target display/paper. |
| device-height | Deprecated. Specifies the height of the target display/paper. |
| grid | Specifies if the output device is grid or bitmap. Possible values are “1” for grid, and “0” otherwise. Example: media=”handheld and (grid:1)” |
| height | Specifies the height of the targeted display area. “min-” and “max-” prefixes can be used. Example: media=”screen and (max-height:700px)” |
| monochrome | Specifies the bits per pixel in a monochrome frame buffer. “min-” and “max-” prefixes can be used. Example: media=”screen and (min-monochrome:2)” |
| orientation | Specifies the orientation of the target display/paper. Possible values: “portrait” or “landscape” Example: media=”all and (orientation: landscape)” |
| resolution | Specifies the pixel density (dpi or dpcm) of the target display/paper. “min-” and “max-” prefixes can be used. Example: media=”print and (min-resolution:300dpi)” |
| scan | Specifies scanning method of a tv display. Possible values are “progressive” and “interlace”. Example: media=”tv and (scan:interlace)” |
| width | Specifies the width of the targeted display area. “min-” and “max-” prefixes can be used. Example: media=”screen and (min-width:500px)” |
HTML <link> hreflang Attribute
Example
Here, the hreflang attribute indicates that the linked document is in English:
<link href=”tag_link.asp” rel=”parent” rev=”subsection” hreflang=”en”>
Definition and Usage
The hreflang attribute specifies the language of the text in the linked document.
This attribute is only used if the href attribute is set.
Note: This attribute is purely advisory.
Differences Between HTML 4.01 and HTML5
NONE.
Syntax
<link hreflang=”langauge_code”>
Attribute Values
| Value | Description |
|---|---|
| language_code | A two-letter language code that specifies the language of the linked document.To view all available language codes, go to our Language code reference. |
HTML <link> href Attribute
Example
Link to an external stylesheet:
<link rel=”stylesheet” type=”text/css” href=”theme.css”>
Definition and Usage
The href attribute specifies the location (URL) of the external resource (most often a style sheet file).
Differences Between HTML 4.01 and HTML5
NONE.
Syntax
<link href=”URL“>
Attribute Values
| Value | Description |
|---|---|
| URL | The URL of the linked resource/document.Possible values:
|
