(Overview 02) HTML 문서 구조

in HTML

SoloLearn HTML 번역


HTML Document Structure

HTML 문서 구조



The <html> Tag

<html> 태그


  • Although various versions have been released over the years, HTML basics remain the same.
    • 수년 간 다양한 버전이 출시되었지만, HTML 기본 사항은 동일하게 유지된다.


  • The structure of an HTML document has been compared with that of a sandwich.
    • HTML 문서의 구조는 샌드위치의 구조에 비유된다.
  • As a sandwich has two slices of bread, the HTML document has opening and closing HTML tags.
    • 샌드위치에 두 개의 빵 조각이 있는 것처럼, HTML 문서에는 여는 HTML 태그와 닫는 HTML태그가 있다.


  • These tags, like the bread in a sandwich, surround everything else:
    • 이러한 태그는 샌드위치의 빵과 마찬가지로, 모든 것을 둘러싼다.
<html>
   ...
</html>


Everything in an HTML document is surrounded by the <html> tag.

HTML 문서의 모든 내용은 <html> 태그로 둘러싸인다.


The <head> Tag

<head> 태그
  • Immediately following the opening HTML tag, you’ll find the head of the document, which is identified by opening and closing head tags.
    • 여는 HTML 태그 바로 다음에 head 태그를 열고 닫음으로써, 문서의 head를 찾을 수 있다.


  • The head of an HTML file contains all of the non-visual elements that help make the page work.
    • HTML 파일의 head에는, 페이지를 작동시키는 데 도움이 되는 모든 비 시각적 element가 포함된다.
<html>
   <head>
      ...
   </head>
</html>


The <body> Tag

<body> 태그
  • The body tag follows the head tag.
    • body 태그는 head 태그 다음에 온다.
  • All visual-structural elements are contained within the body tag.
    • 모든 시각적 구조 element는 body 태그 내에 포함된다.


  • Headings, paragraphs, lists, quotes, images, and links are just a few of the elements that can be contained within the body tag.
    • 제목(heading), 토막글(paragraph), 목록(list), 따옴표(quote), 이미지(image), 링크(link)는 body 태그 내에 포함될 수 있는 element 중 일부일 뿐이다.


  • Basic HTML Structure:
<html>
   <head>
      
   </head>
   <body>
      
   </body>
</html>


The <body> tag defines the main content of the HTML document.

<body> 태그는 HTML 문서의 주요 내용을 정의한다.


QUIZ

  • Fill in the blank to create an opening html tag:
    • 여는 html 태그를 생성해라.

<html>


  • Drag and drop from the options below to create a valid HTML document:
    • 유효한 HTML 문서를 생성해라.
<html>
   <head> </head>
</html>


  • Rearrange the code to create a basic HTML document structure:
    • 기본 HTML 문서 구조를 생성해라.
<html>
   <head>
      
   </head>
   <body>
      
   </body>
</html>