html의 head 태그에 보면 link 태그가 많이 쓰인다는 걸 알수있다.

link를 간단하게 설명하면 말 그대로 '외부에 있는 문서를 연결해준다.' 라는 뜻이다.

link 태그의 사용법으로 기본적으로 <head></head> 사이에 사용해야한다.
중복된 link 태그 사용이 가능하고 <link></link> 형식이 아닌 <link /> 형식으로 닫는다.

rel 속성

이건 문서와 외부에서 불러올 연결관계를 설정하는 것이다.
<link rel="stylesheet"> 가 가장 기본적인데 이건 스타일 시트로써 이 문서를 불러오겠단 의미이다.

stylesheet : 스타일 시트로 연결 ( .css)
alternate : 문서 대안 ( 프린트나 번역 사이트 )로 연결
ex) <link rel="alternate" type="application/test+xml" href="/print/test">
author : 저작자로 연결
help : 도움말로 연결
license : 문서의 저작권 정보로 연결
search : 검색 도구로 연결

rel 속성들이다. 주로 높은 빈도로 사용되는 rel 속성은 stylesheet이다.
개인적으로 일반 적인 홈페이지를 만들때에는 다른 속성들은 별로, 거의 사용되지 않는다.

type 속성

type은 연결문서의 MIME 유형을 나타낸다.

css 파일일 경우 type="text/css"
js 파일일 경우 type="text/javascript"
xml 파일일 경우 type="application/txml"

주로 이렇게 3가지 속성이 많은 빈도를 차지하며, 더 MIME 유형을 보려면

https://www.sitepoint.com/mime-types-complete-list/

이 사이트를 참고 바란다.

href 속성

연결될 문서를 설정해주는 곳이다. 경로 설정에는 상대경로와 절대경로가 있다.

상대경로의 경우에는 현재 머물고 있는 페이지부터 시작해서 경로를 설정하는 방법이고,
절대경로의 경우에는 이 페이지를 가지고 있는 최상위 경로부터 시작해 설정하는 방법이다.

폴더의 위치가
/home/eeiim/common/css.css 에 css 파일이 있고
/home/eeiim/blog/style.html에 html 파일 있다고 가정한다면

style.html의 위치에서 상대 경로로 css파일을 불러오려면
href="../common/css.css"로 불러와야하는 것이고,
절대 경로로 불러오려면
href="/home/eeiim/common/css.css" 이렇게 사용하면 된다.

'WEB > HTML' 카테고리의 다른 글

[HTML] META 태그  (0) 2021.11.29
[HTML] 버튼 클릭으로 이미지 다운로드  (0) 2017.12.27
[HTML] 메타(meta) 태그  (0) 2017.12.12
[HTML] 주석 및 띄어쓰기, 선긋기(hr 태그)  (0) 2017.12.05
[HTML] class와 id의 정의  (0) 2017.12.05

+ Recent posts