このウェブサイトはご利用の端末での閲覧に対応していません。
This website does not support your device.

link要素:外部リソースと関連付ける

記事May 2nd,2015
July 7th,2020
文書を他の外部リソースと関連付ける要素
この記事はHTML Living Standardに対応しています。
この記事はHTML Living Standardに対応しています。

要素について

カテゴリー メタデータ・コンテンツ
body”要素に配置できる場合、フロー・コンテンツフレージング・コンテンツHTML Living Standardで定義
利用場所 本文参照
内容
タグの省略 終了タグはありません

link”要素は文書を他の外部リソースと関連付ける要素です。

外部スタイルシートの読み込みにもっとも多く使用されますが、rel”属性の値によってウェブページのアイコンや先行して読み込むべきコンテンツの指定などさまざまな役割があります。

サンプルコード

<!DOCTYPE html>
<html lang="ja">
<head>
<meta charset="UTF-8">
<link rel="alternate" hreflang="en" href="en/banana.html">
<link rel="icon" href="image/favicon.ico">
<meta name="robots" content="index,follow">
<meta name="keywords" content="バナナ,栄養素,産地">
<meta name="description" content="黄色くて栄養満点な果物であるバナナについて解説します。">
<link rel="stylesheet" type="text/css" href="css/stylesheet-sp.css" media="( max-width: 640px )">
<link rel="stylesheet" type="text/css" href="css/stylesheet-tab.css" media="( min-width: 640px ) and ( max-width: 1280px )">
<link rel="stylesheet" type="text/css" href="css/stylesheet-pc.css" media="( min-width: 1280px )">
<title>黄色いフルーツバナナ - 果物を食べる</title>
</head>
<body>
...

属性と値

現行の仕様で定義されている属性

属性
属性 説明 説明
必須属性(いずれか一つ)
rel="" 文書と外部リソースの関係 リンクタイプ 文書と外部リソースの関係
itemprop=""HTML Living Standardで定義 マイクロデータのプロパティ名を指定する プロパティ名 itemtype”属性で指定された定義に基づくプロパティ名
任意属性
グローバル属性
href="" 文書と関連付ける外部リソース URL 文書と関連付ける外部リソースのURL
crossorigin=""HTML5で追加 外部リソースを読み込む時のCORSリクエストを設定 anonymous CORSリクエストを実行するが、SSL証明書、HTTP認証などの認証情報は使用しない
use-credentials CORSリクエストを実行し、SSL証明書、HTTP認証などの認証情報を使用する
media="" 外部リソースが対象とするメディア メディアクエリ 外部リソースが対象とするメディア条件
integrity=""HTML Living Standardで定義 外部リソースの整合性を確認 ハッシュ値 BASE64でエンコードした外部リソースのハッシュ値
hreflang="" 外部リソースが記述されている言語 言語コード 外部リソースが記述されている言語
type="" 外部リソースのデータの種類 MIMEタイプ 外部リソースのMIMEタイプ
referrerpolicy=""HTML5.2で追加 リファラーポリシーを指定 リファラーポリシー リファラーポリシーを指定
sizes=""HTML5で追加 アイコンのサイズ any サイズの調整が可能
横幅x高さ アイコンのサイズのピクセル数
imagesrcset=""HTML Living Standardで定義 使用可能な画像ファイルのセット URL 画像の横幅w,URL 画像の横幅w,... ビューポートの幅ごとの表示する画像のURL
URL デバイスピクセル比x,URL デバイスピクセル比x,... デバイスピクセル比ごとの表示する画像のURL
imagesizes=""HTML Living Standardで定義 画像を表示するサイズ 長さ imagesrcset”属性を幅記述子(“w”)で指定した時】画像の表示サイズの横幅
メディアクエリ 長さ,メディアクエリ 長さ,...,長さ imagesrcset”属性を幅記述子(“w”)で指定した時】メディア条件ごとの画像の表示サイズの横幅
as=""HTML Living Standardで定義 先行して読み込む外部リソースの利用先 audio audio”要素で埋め込まれる音声ファイル
video video”要素で埋め込まれる動画ファイル
track track”要素で埋め込まれる動画ファイル
script script”要素などで埋め込まれる外部スクリプト
style link”要素で読み込まれるスタイルシート
font @font-face”ルールで読み込まれるフォントファイル
image picture”要素img”要素で埋め込まれる画像ファイル
embed embed”要素で埋め込めれるリソース
object object”要素で埋め込めれるリソース
document frame”要素iframe”要素で埋め込まれるHTML文書
リクエストデスティネーション “Fetch”仕様書に定義されたキーワード
fetch フェッチまたはXHR要求でアクセスされるリソース
color=""HTML Living Standardで定義 Safariのページピンアイコンの色を指定 CSSの<color>”値
disabled=""HTML Living Standardで定義 外部スタイルシートへのリンクの無効化 disabled 外部スタイルシートへのリンクの無効化
title="" rel”属性の値に“stylesheet”を含む時】代替スタイルシートの名前 テキスト 代替スタイルシートの名前
rel”属性の値に“stylesheet”を含まない時】外部リソースに補足情報を付ける テキスト 補足情報

rel”属性マイクロデータ属性itemprop”属性のうちいずれか一つが必須です。また、これらの属性を同時に指定することはできません。

rel”属性の値に“preload”が指定されている場合はas”属性は必須属性です。

グローバル属性title”属性rel”属性の値に“stylesheet”が指定された“link”要素に指定した場合は他の要素に指定した場合と意味合いが異なります。

過去に定義された属性

属性
属性 説明 説明
charset=""注意 外部リソースの文字エンコーディング 文字エンコーディング 外部リソースの文字エンコーディング
rev=""注意 リンク先から見た現在の文書との関係 リンクタイプ リンク先から見た現在の文書との関係
nonce=""HTML5.2で追加 コンテンツセキュリティポリシーのためのワンタイムトークン ワンタイムトークン 自動生成したBASE64でエンコードされた暗号

利用場所

rel”属性の値が“body-ok”な値のみである場合、もしくはマイクロデータ属性itemprop”属性が指定されている場合はフレージング・コンテンツが置ける場所にも配置することができます。

仕様書

link”要素はHTML1.0から定義されている要素です。現行の仕様であるHTML Living Standardでも定義されています。

HTML 4 HTML 5 HTML 5.1 HTML 5.2 HTML Living Standard
<link>
定義あり

定義あり

定義あり

定義あり

定義あり
HTML 4 HTML 5 HTML 5.1 HTML 5.2 HTML Living Standard
href=""
定義あり

定義あり

定義あり

定義あり

定義あり
crossorigin=""
定義なし

定義あり

定義あり

定義あり

定義あり
rel=""
定義あり

定義あり

定義あり

定義あり

定義あり
media=""
定義あり

定義あり

定義あり

定義あり

定義あり
integrity=""
定義なし

定義なし

定義なし

定義なし

定義あり
hreflang=""
定義あり

定義あり

定義あり

定義あり

定義あり
type=""
定義あり

定義あり

定義あり

定義あり

定義あり
referrerpolicy=""
定義なし

定義なし

定義なし

定義あり

定義あり
sizes=""
定義なし

定義あり

定義あり

定義あり

定義あり
imagesrcset=""
定義なし

定義なし

定義なし

定義なし

定義あり
imagesizes=""
定義なし

定義なし

定義なし

定義なし

定義あり
as=""
定義なし

定義なし

定義なし

定義なし

定義あり
color=""
定義なし

定義なし

定義なし

定義なし

定義あり
disabled=""
定義なし

定義なし

定義なし

定義なし

定義あり
HTML 4 HTML 5 HTML 5.1 HTML 5.2 HTML Living Standard
charset=""
定義あり

削除

削除

削除

削除
rev=""
定義あり

削除

定義あり

定義あり

削除
nonce=""
定義なし

定義なし

定義なし

定義あり

グローバル属性
一番上へ
トップにもどる
シェアする
シェアする
Facebookでシェアする
ツイート
Google+でシェア
Pocket
はてなブックマーク