[html5] link 요소에 대한 설명

Link 요소

link (inter-document relationship metadata) link요소는 다른 자원과 연결하기 위해 사용.

 

http://www.w3.org/TR/html5/the-link-element.html#the-link-element

==> A link element must have rel attribute.

마크업 규칙

- 메타데이터에 속함

- head요소의 자식 요소, noscript요소 안에 쓸 수 없음.

 

스타일 시트 선언 예제

<link rel="stylesheet" href="default.css"> <link rel="stylesheet" href="green.css" title="Green styles"> <link rel="alternate stylesheet" href="contrast.css" title="High contrast"> <link rel="alternate stylesheet" href="big.css" title="Big fonts"> <link rel="alternate stylesheet" href="wide.css" title="Wide screen">

 

외부 자원 링크 연동 – 예제

<link rel=alternate href="/en/html" hreflang=en type=text/html title="English HTML"> <link rel=alternate href="/fr/html" hreflang=fr type=text/html title="French HTML"> <link rel=alternate href="/en/html/print" hreflang=en type=text/html media=print title="English HTML (for printing)"> <link rel=alternate href="/fr/html/print" hreflang=fr type=text/html media=print title="French HTML (for printing)"> <link rel=alternate href="/en/pdf" hreflang=en type=application/pdf title="English PDF"> <link rel=alternate href="/fr/pdf" hreflang=fr type=application/pdf title="French PDF">

속성

속성명	설명
전역속성	공통 속성
href	링크의 목적지를 지정합니다. 유효한, 앞뒤 공백은 허용하지만 비어 있지 않은 URL을 사용하여야 합니다. href 속성이 없거나 명세상의 정의에 따라 허용된 값이 아니라면 링크가 만들어지지 않습니다.
rel	링크가 형성하는 관계를 지정합니다. rel 속성이 없거나 명세상의 정의에 따라 허용된 값이 아닌 경우 rel 요소를 정의하지 않아야 합니다.
media	어떤 매체에 적용되는지 나타냅니다. 값은 반드시 유효한 미디어 쿼리여야 합니다.
hreflang	대상 URL의 언어를 명시합니다. 이 속성은 a 요소 및 area 요소의 hreflang 속성과 같은 의미입니다.
type	MIME 타입을 지정합니다. 반드시 유효한 MIME 타입 값이어야 합니다.
sizes	사이트의 icon을 제공 시 이미지의 사이즈를 지정합니다. 이 속성은 icon 키워드를 갖지 않는 rel 속성과 함께 사용될 수 없습니다. 값은 11×11 형태여야 하며 두 숫자는 모두 양의 정수여야 하고 0으로 시작할 수 없습니다.
title	링크에 제목을 부여합니다. 단, 스타일시트 링크의 경우 대체 스타일시트 목록을 설정할 수 있습니다.