코드
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title>Title test</title>
</head>
<body>
body content
</body>
</html>
결과
태그 설명
<!DOCTYPE html>
문서의 첫 유형을 지정하는 단일 태그이다.
이때 문서 유형이란 웹 브라우저에게 "이 문서는 HTML 형식이다"라는 메시지를 전달하는 것과 같다.
현재 표준으로 사용되고 있는 HTML 을 사용하기 위해 적어주는 타입이 html 이다.
<html> </html>
문서 유형을 지정한 후 실제 문서가 시작되고 끝나는 것을 나타내는 태그이다.
<head> </head>
웹 브라우저 화면에는 보이지 않지만, 웹 브라우저가 알아야 할 정보들이 이 태그 안에 들어간다.
<meta charset="utf-8">
문자 인코딩 및 문서 키워드 등에 대한 요약정보를 기입하는 단일태그이다. 문자 인코딩이란 한글을 표시하기 위해 문자 세트를 지정하는 작업으로, 영문과 한글을 모두 사용하기 위해 utf-8 방식을 사용하는 것이 좋다.
<title> </title>
문서의 제목을 나타낸다. 콘텐츠는 브라우저 탭에 표시된다.
<body> </body>
실제 브라우저 화면에 표시될 내용을 입력하는 태그이다.
여기에는 다음과 같은 유형의 태그들이 포함될 수 있다.
- 텍스트를 표시하는 태그
- 이미지를 표시하는 태그
- 각종 사용자 인터페이스(버튼, 입력란, 드롭다운 메뉴 등)를 나타내는 태그
기본 문서 구조를 통해 확인했듯, 태그안에 태그를 포함시키는 방식으로 콘텐츠를 다양하게 구성할 수 있다.
'Study > HTML + CSS' 카테고리의 다른 글
[CSS] rem, em 차이 (0) | 2022.04.23 |
---|---|
HTML 기본 지식 (0) | 2022.04.23 |