【HTML】link要素 - web design lab
にほんブログ村 デザインブログ Webデザインへ PVアクセスランキング にほんブログ村

【HTML】link要素


【HTML】link要素

概要

link要素は関連する別ページとの関係を示す要素です(終了タグがない空要素です)。link要素はhead要素の中に記述します。

汎用属性

id、class、lang、title、style、dir、tabindex、accesskey、contenteditable、spellcheck、draggable、contextmenu、hiddenの各属性を指定することができます。(汎用属性について)

カテゴリー

メタデータ・コンテンツ (カテゴリーについて)

要素の配置

メタデータ・コンテンツが配置できる場所

要素の内容

空要素

属性名 解説
href 関係するファイルのURLを指定
href="URL"
rel href属性で指定したファイルとの関係を示
rel="キーワード"
media href属性で指定したファイルが対象としているメディアを指定
media="対象メディア"
hreflang href属性で指定したファイルの言語コードを指定
hreflang="言語コード"
type href属性で指定したファイルのMIMEタイプを指定
type="MIMEタイプ"
sizes rel="icon"を指定した場合アイコンのサイズを指定。「any」または半角英数で「幅x高さ」(例:5x6)で指定。
sizes="サイズ"
referrerpolicy リファラーポリシーの指定
referrerpolicy=""
nonce “Content Security Policy”のワンタイムトークンの指定
nonce=""
rel属性の値(リンクタイプ)
説明
alternate 代替文書を指定
author そのページの作者へのリンクを指定
help ヘルプへのリンクを指定
icon アイコンのインポートを指定
license 文書の著作権に関するページへのリンクを指定
next 次ページへのリンクを指定
prev 前ページへのリンクを指定
pingback 文書のpingbackサーバを指定
prefetch 外部リソースを指定
search 関連ページを検索するためのリンクを指定
sidebar ブラウザのサイドバーに表示する外部リソースを指定
stylesheet スタイルシートを指定
tag ページに付けるタグを指定
canonical HTML5.2で追加
noreferrer HTML5.2で追加
apple-touch-icon HTML5.2で追加
HTML

<!DOCTYPE html>
<html lang="ja">
<head>
<title>サンプル</title>
<link rel="stylesheet" href="sample.css">
<link rel="alternate stylesheet" href="alternate_sample.css">
</head>
<body>
<p>本文</p>
</body>
</html>

にほんブログ村 デザインブログ Webデザインへ PVアクセスランキング にほんブログ村