HTML 튜토리얼

HTML 홈 HTML 소개 HTML 편집기 HTML 기본 HTML 요소 HTML 속성 HTML 제목 HTML 단락 HTML 스타일 HTML 서식 HTML 인용문 HTML 주석 HTML 색상 HTML CSS HTML 링크 HTML 이미지 HTML 파비콘 HTML 테이블 HTML 목록 HTML 블록 및 인라인 HTML 클래스 HTML ID HTML 아이프레임 HTML 자바스크립트 HTML 파일 경로 HTML 헤드 HTML 레이아웃 반응형 HTML HTML 컴퓨터 코드 HTML 의미론 HTML 스타일 가이드 HTML 엔티티 HTML 기호 HTML 이모티콘 HTML 문자 집합 HTML URL 인코딩 HTML 대 XHTML

HTML 양식

HTML 양식 HTML 양식 속성 HTML 양식 요소 HTML 입력 유형 HTML 입력 속성 HTML 입력 양식 속성

HTML 그래픽

HTML 캔버스 HTML SVG

HTML 미디어

HTML 미디어 HTML 비디오 HTML 오디오 HTML 플러그인 HTML 유튜브

HTML API

HTML 지리적 위치 HTML 드래그/드롭 HTML 웹 스토리지 HTML 웹 작업자 HTML SSE

HTML 예제

HTML 예제 HTML 퀴즈 HTML 연습 HTML 인증서 HTML 요약 HTML 접근성

HTML 참조

HTML 태그 목록 HTML 속성 HTML 전역 속성 HTML 브라우저 지원 HTML 이벤트 HTML 색상 HTML 캔버스 HTML 오디오/비디오 HTML 문서 유형 HTML 문자 집합 HTML URL 인코딩 HTML 언어 코드 HTTP 메시지 HTTP 메소드 PX에서 EM으로 변환기 키보드 단축키

HTML 소개


HTML은 웹 페이지를 만들기 위한 표준 마크업 언어입니다.


HTML이란 무엇입니까?

  • HTML은 Hyper Text Markup Language의 약자입니다.
  • HTML은 웹 페이지를 만들기 위한 표준 마크업 언어입니다.
  • HTML은 웹 페이지의 구조를 설명합니다
  • HTML은 일련의 요소로 구성됩니다.
  • HTML 요소는 브라우저에 콘텐츠를 표시하는 방법을 알려줍니다.
  • HTML 요소는 "이것은 제목입니다", "이것은 단락입니다", "이것은 링크입니다" 등과 같은 콘텐츠 조각에 레이블을 지정합니다.

간단한 HTML 문서

예시

<!DOCTYPE html>
<html>
<head>
<title>Page Title</title>
</head>
<body>

<h1>My First Heading</h1>
<p>My first paragraph.</p>

</body>
</html>

예시 설명

  • <!DOCTYPE html>선언은 이 문서가 HTML5 문서임을 정의합니다 .
  • <html>요소는 HTML 페이지의 루트 요소입니다 .
  • <head>요소에는 HTML 페이지에 대한 메타 정보가 포함됩니다 .
  • 요소 는 <title>HTML 페이지의 제목을 지정합니다(브라우저의 제목 표시줄 또는 페이지의 탭에 표시됨)
  • 요소는 문서 의 <body>본문을 정의하며 표제, 단락, 이미지, 하이퍼링크, 표, 목록 등과 같이 보이는 모든 내용을 담는 컨테이너입니다.
  • <h1>요소는 큰 제목을 정의합니다 .
  • <p>요소는 단락을 정의합니다 .

HTML 요소란 무엇입니까?

HTML 요소는 시작 태그, 일부 콘텐츠 및 종료 태그로 정의됩니다.

< tagname > 내용은 여기에 갑니다... < /tagname >

HTML 요소 는 시작 태그에서 종료 태그까지의 모든 것입니다.

< h1 > 나의 첫 번째 제목 < /h1 >
< p > 나의 첫 문단. < /p >
Start tag Element content End tag
<h1> My First Heading </h1>
<p> My first paragraph. </p>
<br> none none

참고: 일부 HTML 요소에는 콘텐츠가 없습니다(예: <br> 요소). 이러한 요소를 빈 요소라고 합니다. 빈 요소에는 종료 태그가 없습니다!



웹 브라우저

웹 브라우저(Chrome, Edge, Firefox, Safari)의 목적은 HTML 문서를 읽고 올바르게 표시하는 것입니다.

브라우저는 HTML 태그를 표시하지 않지만 이를 사용하여 문서를 표시하는 방법을 결정합니다.

브라우저에서 보기


HTML 페이지 구조

다음은 HTML 페이지 구조의 시각화입니다.

<html>
<머리>
<title>페이지 제목</title>
</head>
<본체>
<h1>제목입니다</h1>
<p>이것은 단락입니다.</p>
<p>다른 단락입니다.</p>
</바디>
</html>

참고: <body> 섹션(위의 흰색 영역) 안의 콘텐츠는 브라우저에 표시됩니다. <title> 요소 안의 콘텐츠는 브라우저의 제목 표시줄이나 페이지의 탭에 표시됩니다.


HTML 히스토리

World Wide Web의 초창기부터 HTML에는 여러 버전이 있었습니다.

Year Version
1989 Tim Berners-Lee invented www
1991 Tim Berners-Lee invented HTML
1993 Dave Raggett drafted HTML+
1995 HTML Working Group defined HTML 2.0
1997 W3C Recommendation: HTML 3.2
1999 W3C Recommendation: HTML 4.01
2000 W3C Recommendation: XHTML 1.0
2008 WHATWG HTML5 First Public Draft
2012 WHATWG HTML5 Living Standard
2014 W3C Recommendation: HTML5
2016 W3C Candidate Recommendation: HTML 5.1
2017 W3C Recommendation: HTML5.1 2nd Edition
2017 W3C Recommendation: HTML5.2

이 튜토리얼은 최신 HTML5 표준을 따릅니다.