Eojin Han

현재 문서와 외부 리소스 간의 관계를 명시함.

기본적으로 <head> 태그 안에 명시한다.

stylesheet처럼 body-ok(<body> 안에서 명시) 한 링크 타입도 있지만 좋은 예시가 아니다. head에 두도록 하자.

기본


css 연결
<link href="main.css" rel="stylesheet" />

favicon 연결
<link rel="icon" href="favicon.ico" />

모바일 플랫폼에서 연계될 자원들 연결
<link
  rel="apple-touch-icon"
  sizes="114x114" // 아이콘 사이즈
  href="apple-icon-114.png"
  type="image/png" // 링크될 자원의 MIME type
/>

조건부 로딩

media 속성에 type or query로 조건을 명시할 수 있음.

조건이 true일 때만 로드됨.


<link 
	href="print.css" 
	rel="stylesheet" 
	media="print" // type
/>

<link
  href="mobile.css"
  rel="stylesheet"
  media="screen and (max-width: 600px)" // query
/>

성능, 보안 관련

자세한 건 생략. 필요 시 찾아보기


<link
  rel="preload"
  href="myFont.woff2"
  as="font"
  type="font/woff2"
  crossorigin="anonymous" 
/>