<link/> Tag Examples

Examples of the <link/> tag in HTML 5
Link to favorites icons of various sizes
<link rel="icon" sizes="128x128" type="image/vnd.microsoft.icon" href="/favicon_128x128.ico"/>
<link rel="icon" sizes="64x64" type="image/vnd.microsoft.icon" href="/favicon_64x64.ico"/>
<link rel="icon" sizes="48x48" type="image/vnd.microsoft.icon" href="/favicon_48x48.ico"/>
<link rel="icon" sizes="32x32" type="image/vnd.microsoft.icon" href="/favicon_32x32.ico"/>
<link rel="icon" sizes="16x16" type="image/vnd.microsoft.icon" href="/favicon_16x16.ico"/>
<link rel="shortcut icon" sizes="16x16" type="image/vnd.microsoft.icon" href="/favicon.ico"></link>

The last link element, which points to the favicon.ico default location and is closed with an ending </link> tag, is for Internet Explorer, which treats the "shortcut icon" relationship in a non-standard way as a single value rather than a space-separated list. The slash at the beginning of the href attributes indicates that the favorites icons are in the default location at the root of the web site's document tree.

Link to default and alternate style sheets
<link rel="alternate stylesheet" type="text/css" title="Printer-Friendly" href="/print.css"/>
<link rel="stylesheet" type="text/css" media="print" href="/print.css"/>
<link rel="stylesheet" type="text/css" media="screen" href="/screen.css"/>
<link rel="stylesheet" type="text/css" media="handheld" href="/handheld.css"/>

The slash at the beginning of the href attributes indicates that the style sheets are in the default location at the root of the web site's document tree.

The user can select an alternate stylesheet using options provided by some browsers, such as the Page Style menu in Firefox. To see this in action go to the differences section at the bottom of this article and select the "Incorrect code in red" style from the View -> Page Style menu in Firefox or the View -> Style menu in IE.

Link in a single blog post, pointing to the feed containing it
<link rel="feed" href="http://www.HTML-5.com/feeds/html5-tutorial.xml"/>
Link in index summary of blog posts, pointing to a feed with the same items
<link rel="feed alternate" href="http://www.HTML-5.com/feeds/html5-tutorial.xml"/>

The <link> tag in the feed <channel> would probably point back to the document containing this link.