HTML이란? What is HTML?

HTML은 웹 표준에 정해진 이름(p, div, span 등등)으로 태그 이름을 작성한다.

Opening Tag, Closing Tag, Content로 구성된 것을 Element라고 한다.

Tag의 꺾새 사이에 태그 이름과 함께 들어가는 내용들은 개발자가 브라우저에게 보여주기 위한 것이며, 태그 사이에 들어가는 것이 유저에게 전달하고자 하는 것이다.

브라우저는 HTML태그 사이의 줄바꿈을 무시한다.

HTML5에서 태그 이름은 대소문자를 구별하지 않으나 소문자로 쓰는 것을 권장한다. 이는 가독성 향상 때문이다.

Content가 없는 요소들은 위와 같이 정해져 있는데 Closing Tag를 명시할 필요가 없다.

Content 위치에 태그를 다시 넣게 되면 하위로 포함되게 된다.

메모를 추가하거나 사용하지 않는 코드를 임시로 처리한다. (브라우저도 읽지 않는다.)

<!-- comments -->

정말 필요할 때만 쓰자.

<!DOCTYPE html> // 문서의 타입을 명시하는 용도, 관습이고 필요는 없음

html : 페이지 전체를 감싸는 root 요소. head와 body라는 자식을 가진다.

head : 직접적으로 나타나지 않는 페이지의 정보들(meta tag, title, author 등)

body: 화면에 보여주는 모든 컨텐츠

HTML <head> 요소는 기계(브라우저)가 식별할 수 있는 문서 정보(메타데이터)를 담습니다. 정보로는 문서가 사용할 제목, 스크립트, 스타일 시트 등이 있습니다.

head는 closing tag 생략이 가능하지만 브라우저마다 다르니 생략하지 말자.

(MDN) HTML <body> 요소는 HTML 문서의 내용을 나타냅니다. 한 문서에 하나의 <body> 요소만 존재할 수 있습니다.

MDN을 보면 Attribute들이 나열되어 있는데 쓰레기통은 이제 지원이 불가한 것들이니 사용하지 않고 원래 body는 단독으로 사용하게 된다.

head, body는 모든 브라우저가 다 호환된다.

왜 특성에 따라 나누는가 카테고리화해야 새로 배워도 금방 익힌다.

단독으로 사용하면 눈에 보이지 않고 여러 요소를 그룹화해준다.

단독으로 사용해도 눈으로 확인할 수 있다.

언제나 새로운 줄에서 시작하고 가능한 모든 너비를 차지한다.

상자를 아래로 쌓는 것.

줄의 어디든 시작할 수 있다.

바로 이전 요소가 끝나면 시작하고 Content만큼만 차지한다.

블록/인라인처럼 암기할 필요는 없지만 MDN에서 요소를 파악할 때 편하다. 기술요약 표에 적혀있다.

플로우 컨텐츠에 아래 5개 컨텐츠가 포함된다.