head 태그란?
HTML 문서상단에는 <head>라는 태그가 있습니다.
<head>라는 태그는 <head>로 시작하여 </head>로 끝나는데, 문서의 대한 정보가 들어 있습니다.
쉽게 생각하시면 문서의 머리말이라고 생각하시면 됩니다.
<head>는 HTML 문서를 불러올 때 화면에 표시하지 않습니다.
head 태그에 들어가는 요소
<head>안에는 title, meta, link, script등이 들어갑니다.
아래의 코드는 head를 작성하는 예시입니다.
<head>
<meta charset="utf-8">
<title>꿍짱의 블로그</title>
<link rel="stylesheet" type="text/css" href="common.css" />
<script type="text/javascript" src="jquery-1.9.1.min.js"></script>
</head>title 태그
title 태그
<title>태그는 말 그대로 웹페이지의 제목입니다.
태그안에 내용을 넣으면 내용이 바뀌게 됩니다. 한 문서 안에서 한번만 사용할 수 있습니다.
<head>
<title>꿍짱의 블로그</title>
</head>
위와 같은 코드를 넣었을때 아래의 이미지와 같은 결과를 얻을 수 있습니다.
웹브라우저의 제목이 바뀐것을 확인 할 수 있습니다.
meta 태그
<meta>태그는 HTML문서를 설명하는 태그로, 직접적으로 페이지에 표시가 되지 않습니다.
사람의 위한 것이라기 보단 프로그램이나 검색엔진을 위한 정보라고 생각하시면 좋을 것 같습니다.
<head>
<meta charset="utf-8">
<title>꿍짱의 블로그</title>
</head>위 코드에 나오는 <meta charset="utf-8">는 문서에서 허용하는 문자들의 집합을 정의해주는 것입니다.
UTF-8은 유니코드를 인코딩(encoding)하는 방식으로 세계적으로 많이 쓰이고 있습니다.
meta태그는 나중에 더 자세하게 설명해드리도록 하겠습니다.
script 태그 와 link 태그
<script>태그는 js파일을 불러 오거나, 자바스크립트를 사용할 때 사용 하는 태그입니다.
<link>태그는 css파일을 불러 올때 사용 하는 태그입니다.
<link rel="stylesheet" type="text/css" href="common.css" />
<script type="text/javascript" src="jquery-1.9.1.min.js"></script>사용방법은 위 코드와 같습니다.
<link>태그는 href에 경로를 넣어서 css파일을 불러 올 수 있습니다.
<script>태그는 href에 경로를 넣어서 js파일을 불러 올 수 있습니다.
위 코드는 css와 자바스크립트를 다룰때 더 자세히 포스팅 하도록 하겠습니다.
HTML을 처음 접하신다면 link 태그와 script 태그는 모르고 넘어가셔도 괜찮습니다.
나중에 css와 자바스크립트를 사용하게 되신다면 자연스럽게 알게 될 내용이기도 합니다.
끝까지 읽어주셔서 감사합니다.
이상 끝!
'IT > HTML & CSS' 카테고리의 다른 글
| HTML 체크박스(checkbox) 만들기 input checked 속성 (0) | 2024.03.26 |
|---|---|
| CSS 드롭다운 메뉴(gnb) 만들기 (0) | 2024.03.20 |
| CSS 사용자 속성 변수 사용하기 (0) | 2024.03.20 |
| HTML/CSS[2탄] HTML태그 소개(h1~h6 태그, p 태그, br 태그) - 01 (0) | 2021.06.17 |
| HTML/CSS[1탄] HTML 기초부터 튼튼히! (0) | 2021.06.16 |