01. HTML Introduction

익스랩 최고 관리자

·

2019. 10. 28. 19:18

반응형

 

 

 

 

HTML 이란?


  • HTML은 Hyper Text Markup Language를 의미한다.
  • 마크업 언어는 마크업 태그들의 집합이다.
  • HTML 문서들은 HTMl 태그들로 서술된다.
  • 각각의 HTMl 태그는 서로 다른 문서 내용을 서술한다.

 

 

간단한 HTML 문서


 

See the Pen JqvaJV by heunho (@heunho) on CodePen.

 

 

예제 설명

  • <!DOCTYPE html> 선언은 해당 문서를 HTML5로 정의해줍니다.
  • <html> 요소는 HTML 페이지의 root 요소입니다.
  • <head> 요소는 문서에 대한 meta 정보를 포함합니다.
  • <title> 요소는 문서의 제목을 지정합니다.
  • <body> 요소는 보이는 페이지 내용을 포함합니다.
  • <h1> 요소는 큰 제목을 정의합니다.
  • <p> 요소는 단락을 정의합니다.

 

 

HTML 태그


HTML 태그는 <> 기호로 묶인 요소 이름입니다.

<tagname>content goes here...</tagname>

HTML 태그는 일반적으로 <p> 및 </p>와 같이 쌍으로 표시됩니다.

쌍의 첫 번째 태그는 시작 태그이고, 두 번째 태그는 종료 태그입니다.

종료 태그는 시작 태그와 비슷하지만 태그 이름 앞에 슬래시( / )가 삽입되어있습니다.

TIP : 시작 태그는 여는 태그라고도 하고 종료 태그는 닫는 태그라고도 합니다.

 

 

Web 브라우저


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

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

Web 브라우저

 

 

HTML 페이지 구조


HTML 페이지 구조를 시각화하면 아래와 같습니다.

 

HTML 페이지 구조

참고 : <body> 섹션 (위 이미지의 흰색 영역) 안에 있는 내용만 브라우저에 표시된다.

 

 

<! DOCTYPE> 선언


<! DOCTYPE> 선언은 문서 유형을 나타내며 브라우저가 웹 페이지를 올바르게 표시하도록 합니다.

HTML 태그보다 먼저 페이지 상단에 한 번만 작성해야 합니다.

<! DOCTYPE> 선언은 대 / 소문자를 구분하지 않습니다.

HTML5의 <!DOCTYPE> 선언은 다음과 같습니다.

<!DOCTYPE html>

 

 

HTML 버전들


초기 웹 이래로 많은 HTML 버전이 있었습니다. (참고만 하세요)

Version Year
HTML 1991
HTML 2.0 1995
HTML 3.2 1997
HTML 4.01 1999
XHTML 2000
HTML5 2014

 

 


틀린 내용, 오타, 오역이 있을 경우 댓글로 알려주시면 감사하겠습니다.

질문도 올려주시면 아는 선에서 답변해드리겠습니다.


대부분의 내용의 저작권은 w3schools에 있습니다.

 

Introduction to HTML

HTML Introduction What is HTML? HTML is the standard markup language for creating Web pages. HTML stands for Hyper Text Markup Language HTML describes the structure of Web pages using markup HTML elements are the building blocks of HTML pages HTML elements

www.w3schools.com

 

 

반응형

'IT 언어 연구소 > HTML,CSS [초급, 기본 개념, W3C 번역]' 카테고리의 다른 글

05.HTML Heading  (0) 2019.10.28
04.HTML Attributes  (0) 2019.10.28
03. HTML Elements  (0) 2019.10.28
02. HTML Basic  (0) 2019.10.28
[w3school(HTML) 번역 프로젝트] 시작에 앞서  (0) 2019.10.28

💖 포스터에게 힘 보내기 💖

카카오뱅크
3333-25-9477515
치킨 좋아하는 포스터