HTML

HTML은 웹페이지의 구조를 나타내는 프로그래밍 언어입니다. 웹페이지의 기본 구조를 구성하고 각 구조의 기능과 의미를 부여합니다. 웹 개발을 시작할 때 가장 먼저 배우는 언어로 초보자도 쉽게 배울 수 있습니다.

HTML

안녕하세요. 
저는 비전공자로 취미로 코딩을 배우고 있습니다.
배운 내용을 정리하고, 까먹었을 때 다시 보기 위해 정리해보려고 합니다.
기초적인 이론부터 시작해서 다양한 기능 구현까지 올려보는 게 목표입니다.

html 예제

위에 이미지는 HTML의 기본 구조입니다. VSCode emmet을 통해 자동으로 생성했습니다.
VSCode와 Emmet에 대한 내용은 다음에 다루겠습니다.
웹페이지에 나타나는 문단(Paragraph), 버튼(Button), 입력창(Input) 등 모든 것들은 요소(Element)로 만들어졌으며, 태그(Tag)와 속성(Property)내용(Content)로 이루어져 있습니다.
 "<"와">"로 묶인 부분을 태그라고 합니다. 예를 들어 <p>는 p 태그이고, 문단을 나타내는 태그입니다.
태그는 여는 태그<p>와 닫는 태그</p>로  구성되며, 여는 태그와 닫는 태그 사이에 내용을 넣어 완성합니다.
태그와 내용을 통틀어 요소(Element)라고 합니다.
참고로 내용과 닫는 태그가 없는 빈 요소 (Empty element)도 있습니다. 

위의 HTML 태그를 작성해서 index.html로 저장한 뒤 열어보시면 아래와 같은 웹페이지가 나타납니다.

index.html 보기

 

HTML에는 사용자에게 보여지는 데이터와 보여지지 않는 데이터가 함께 들어있습니다.
head와 body로 이 부분을 나누는데, head와 body에 대한 내용은 다음에 다뤄보도록 하겠습니다.