반응형
기본구조, 오늘 우리가 공부할 내용
각 태그가 의미하는 내용
1. <!DOCTYPE html>
- 단일태그
- 문서의 유형을 지정
2. <html>~</html>
- 문서 유형을 지정한 후 실제 html 문서의 시작과 끝이라는 의미
- 사이에 들어가는 내용이 html 문서의 내용
- 그 내용들 또한 여러가지 태그로 표현 가능 -> 태그 안에 태그가 들어가는 것이 가능하다
3. <head>~</head>
- 들여쓰기로 태그와 태그 사이에 포함관계 표현 but 가독성에 도움을 주기 위한 것. 문법적 필수 사항은 아님!
- 웹브라우저에는 보이지 않지만 웹브라우저가 알아야하는 정보들은 모두 이 태그에 들어감
<meta charset="utf-8">
- 문자 인코딩 및 문서 키워드 등에 대한 요약 정보를 기입하는 단일 태그
(문자 인코딩 : 한글을 표시하기 위해 문자 세트를 지정하는 작업. 영문과 한글을 모두 사용하기 위해 utf-8 방식을 사용하는 것이 좋음)
<title>~</title>
- 문서의 제목을 나타냄
- 콘텐츠는 브라우저 탭에 표시됨
- 위 두 태그 이외에도 다양한 정보들이 추가될 수 있음
4. <body>~</body>
- 실제 브라우저 화면에 표시될 내용을 입력하는 태그
- 여기에 포함될 수 있는 태그들
- 텍스트를 표시하는 태그
- 이미지를 표시하는 태그
- 각종 사용자 인터페이스(버튼, 입력란, 드롭다운 메뉴 등)를 나타내는 태그
기본 문서 구조를 통해 확인했듯, 태그 안에 태그를 포함하는 방식으로 콘텐츠를 다양하게 구성 가능!
결과
*유노코딩님 영상을 통해 공부 중입니다.
반응형
'비전공자의 고군분투 코딩공부 > HTML' 카테고리의 다른 글
6. 태그의 구분은 뭐고, 인라인 텍스트 요소는 뭐여? (0) | 2023.05.09 |
---|---|
5. 텍스트를 표시하는 태그는 뭐여? (0) | 2023.04.25 |
3. HTML 코드 기초 문법은 뭐여? (0) | 2023.04.19 |
2. 개발자 도구와 코드 에디터는 뭐여? (1) | 2023.04.14 |
1. HTML이 뭐여? (0) | 2023.04.10 |