HTML은 Hyper Text Markup Langauage 로 웹 페이지의 뼈대를 잡는 문서이다.
웹 페이지의 제목, 본문, 요소 등을 정의하는 역할을 수행하며 트리구조의 태그들로 이루어져 있다.
여는 태그와 닫는 태그가 있으며 태그들 사이에 다른 태그를 끼워넣는 문법 구조를 갖고 있다.
HTML 문서들은 다음과 같은 뼈대 태그에 다른 태그를 삽입하도록 하고 있어, 현재의 모든 HTML 문서는 헤드 태그, 바디 태그로 구분된다.
<html> <head>.....</head> <body>.....</body> </html>```
크롬에서 개발자도구 => 요소 탭을 클릭하면 나오는 코드들이 현재 보고 있는 웹페이지의 HTML 문서에 해당한다.
<ul>, <ol>
은 부모 태그이고 <li>
는 자식 태그이다. <ul>
은 순서가 없는 리스트, <ol>
는 순서(번호)가 있는 리스트 이다. 시맨틱 요소라는 HTML 문서 내에서 특정 역할을 수행하는 태그는 아니지만, 설명적인 의미를 가진 요소를 의미한다. div 로 모든 것을 두지 않고 <article>
, <footer>
, <header>
등으로 태그를 구분하는 것처럼, 검색엔진이나 개발자에 입장에서 어떤 의미를 가진 요소라는 것을 설명할 수 있도록 쓰이는 태그를 말한다.
<article>
: 독립적인 자체 포함 콘텐츠<aside>
: 본문 외에 부가부분, 사이드바, 광고창 등<footer>
: 웹페이지 가장 아랫부분, 라이선스, 주소, 연락처 등<header>
: 웹페이지 가장 상단부분, 웹페이지의 제목<nav>
: 네비게이션, 메뉴바에 해당<main>
: 문서의 주된 콘텐츠id : 고유한 이름을 붙일 때 -> div#writing-section
class : 반복되는 영영ㄱ을 유형별로 분류할 때 -> li.comment