https://html.spec.whatwg.org/multipage/

<!DOCTYPE html>

HTML 요소처럼 보일 수 있지만 실제로는 HTML 요소가 아닙니다. 'doctype'이라는 특별한 종류의 노드입니다. doctype은 브라우저에 표준 모드를 사용하도록 지시합니다. 이를 생략하면 브라우저에서 쿼크 모드라고 하는 다른 렌더링 모드를 사용합니다. doctype을 포함하면 쿼크 모드를 방지할 수 있습니다.

쿼크 모드

현재 웹 브라우저의 레이아웃 엔진에서 사용하는 모드는 세 가지입니다. quirks모드, limited-quirks모드 그리고 no-quirks모드 입니다. doctype을 통해 no-quirks를 적용할 수 있으며 현대 브라우저의 경우 no-quirks를 사용합니다.

lang

lang 속성 값은 2자 또는 3글자의 ISO 언어 코드 뒤에 지역이 오는 형식입니다.

CSS 선택자에서 사용할 수 있습니다. <span lang="fr-fr">Ceci n'est pas une pipe.</span>는 속성 및 언어 선택기 [lang|="fr"] 및 :lang(fr)를 사용하여 타겟팅할 수 있습니다.

head

<head>의 맨 처음 요소는 charset 문자 인코딩 선언이어야 합니다.

<meta charset="utf-8" />

meta

이 메타 태그는 사이트 응답성을 높여 표시 영역 너비와 관계없이 기본적으로 콘텐츠가 잘 렌더링되도록 합니다.

// 콘텐츠 너비를 화면 너비로 하여 사이트를 반응형으로 만든다
<meta name="viewport" content="width=device-width" />

// user-scaleable이 yes(=1) 상태이면
// input창을 focus했을떄 자동으로 화면이 줌인된다.
<meta name="viewport" content="width=device-width, initial-scale=1, user-scalable=1" />

css 를 import 하는 3가지 방법

<link rel="stylesheet" href="styles.css">
<style>
css 작성 ...

// 아래와 같이 외부 css import도 가능
  @import "styles.css" layer(firstLayer);
</style>