반응형
<!DOCTYPE html>
<html lang="ko">
<head>
<meta charset="UTF-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>My First Web Page!</title>
</head>
<body>
<!-- 웹 페이지에 표시할 내용 -->
<p>나의 첫 번째 웹 페이지!</p>
</body>
</html>
DTD
문서형 정리
HTML5 문서 형식으로 해석
<!DOCTYPE html>
html 태그
HTML 문서의 시작과 끝
모든 태그는 html 태그 안에 콘테츠로서 작성해야함
<html lang="ko">
</html>
head 태그
문서 정보 정의
즉, HTML 문서의 메타데이터 정의 영역
웹 브라우저 직접 노출 ❌
meta, title, link 등 문자열, 문서 제목, CSS, 자바스크립트 참조 경로 등을 정의
(⭐️ 메타데이터 : HTML 문서에 대한 정보)
<head>
<!-- 해당 문서의 인코딩 언어를 UFT-8 형식을 지정함 -->
<meta charset="UTF-8">
<!-- 인터넷 익스플로어의 렌더링 엔진을 강제로 최신 렌더링 엔진으로 지정 -->
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<!-- 기기의 화면 너비에 맞추기 -->
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<!-- 문서 제목 지정 -->
<title>My First Web Page!</title>
</head>
👀 viewport 👀
반응형 웹페이지에서는 필수
✨ title 태그 ✨
생략 불가능
반드시 1개
중복되지 않도록 주의
title 태그를 사용하지 않았을 경우, 웹브라우저는 해당 HTML문서를 웹페이지로 인식하지 않음
반응형
'HTML + CSS + 자바스크립트' 카테고리의 다른 글
CSS 적용 우선 순위에 따라 결과가 달라진다 : 개별성 규칙 (0) | 2023.11.28 |
---|---|
가상 클래스 선택자가 뭐지?? (0) | 2023.11.27 |
HTML 많이 사용하는 input 태그의 type 속성값 (0) | 2023.11.23 |
HTML 필수 태그 : 텍스트, 그룹, 목록, 링크, 이미지, 텍스트 강조 (0) | 2023.11.22 |
HTML에서 주석을 조심해서 써야하는 이유 (2) | 2023.11.21 |