<link ref=”①” href=”②” ③>
①キーワード(stylesheet、next、prev、など)
②URL
③必要な属性(type属性など)
link要素でHTML文書を別のファイルと関連付け、それがどのような関係であるのかを表します。
関連付けるファイルのURLをhref属性で指定し、その関係性を表すキーワードをrel属性で指定します。
■rel属性
関連付けるファイルがこのHTML文書から見てどのような関係であるのかを、既定のキーワードで指定します。
例）現在の文書がpage2.htmlの場合は次のようになります。
<link rel=”index” href=”../index.html”> ← indexページとの関係
<link rel=”next” href=”page3.html”> ← 次の文書はpage3.html
<link rel=”prev” href=”page1.html”> ← 前の文書はpage1.html
スタイルシート用の外部ファイルを読み込むときにも、link要素を利用します。
例）style.cssファイルを読み込む場合は次のようになります。
<link rel=”stylesheet” href=”style.css” type=”text/css”>
<link rel=”stylesheet” href=”style.css”>
■type属性
関連付けるファイルのMIMEタイプを指定する場合は、type属性で指定します。
■media属性
href属性に指定されたファイルを、どのメディアに適用するのかを指定します。
<link rel=”stylesheet” media=”screen” href=”screen.css” title=”PC用”>
<link rel=”stylesheet” media=”print” href=”print.css” title=”PRINT用”>
■サンプル
<!DOCTYPE html>
<html lang=”ja”>
<head>
<meta charset=”UTF-8”>
<title>文書同士の関係を表す</title>
<link rel=”stylesheet” href=”style.css” type=”text/css”>
<link rel=”prev” href=”page1.html”>
<link rel=”next” href=”page3.html”>
<link rel=”help” href=”help.html”>
<link rel=”author” href=”profile.html”>
</head>
<body>
<p>SAMPLE</p>
</body>
</html>
■要素解説
カテゴリー：メタデータ・コンテンツ
利用できる場所：メタデータ・コンテンツが期待される場所/head要素の子要素であるnoscript要素内
コンテンツモデル：空
■ブラウザ対応状況
IE10=○、IE9=○、Firefox=○、Chrome=○、Safari=○、Opera=○、iOS6=○、iOS5=○、Android=○
■廃止属性
charset属性、rev属性、target属性