기본 구조

HTML 문서는 항상 <html> 안에 <head>와 <body>를 포함하는 계층 구조를 따릅니다.

html

속성	설명
`lang`	문서의 기본 언어를 지정합니다. (예: `en`은 영어, `ko`는 한국어)
`dir`	텍스트 방향을 지정합니다. (`ltr`: 왼쪽에서 오른쪽, `rtl`: 오른쪽에서 왼쪽)
`manifest`	오프라인 웹 애플리케이션을 위한 캐시 매니페스트 파일의 URL을 지정합니다. (HTML5에서 사용, 현재는 비추천)

<html lang="ko">
  <head>
    <title>예시 페이지</title>
  </head>
  <body>
    <h1>안녕하세요!</h1>
    <p>이것은 한국어로 작성된 HTML 문서입니다.</p>
  </body>
</html>

설명: lang="ko" 속성을 사용하여 문서의 기본 언어를 한국어로 지정했습니다.

head

<html lang="en">
  <head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>My Website</title>
    <link rel="stylesheet" href="styles.css">
  </head>
  <body>
    <h1>Welcome</h1>
  </body>
</html>

설명:
- <meta charset="UTF-8">: 문자 인코딩을 UTF-8로 설정.
- <meta name="viewport">: 모바일 디바이스에서 적절히 표시되도록 뷰포트 설정.
- <link>: 외부 CSS 파일 연결.

body

속성	설명
`onload`	페이지 로드가 완료될 때 실행할 스크립트를 지정합니다.
`onunload`	페이지가 닫힐 때 실행할 스크립트를 지정합니다.

<html lang="en">
  <head>
    <title>Body Example</title>
  </head>
  <body onload="alert('페이지가 로드되었습니다!')">
    <h1>Hello, World!</h1>
    <p>This is the content visible to users.</p>
  </body>
</html>

설명: onload 속성을 사용하여 페이지 로드 시 경고창이 표시되도록 설정했습니다.

1.9 KiB Raw Blame History

기본 구조

html

head

body

1.9 KiB

Raw Blame History