[HTML] 4. HTML 기본 태그

2019. 12. 24. 21:18

<html>
</html>

1. 문서 형식 정의 태그

Document Type Definition

출력할 웹 페이지의 형식을 브라우저에게 전달한다.

문서의 최상위에 위치해야하며 대소문자를 구별하지 않는다.

HTML5

<!DOCTYPE html>

2. html 태그

웹페이지에 단 하나만 존재.

모든 요소는 html요소의 하위 요소이다.

html요소 역시 클로벌 어트리뷰트를 지원한다.

<html>
</html>

3. head 태그

head 요소는 메타데이터를 포함하기 위한 요소이다.

웹페이지에 단 하나만 존재.

메타데이터는 title, style, link, script에 대한 정보를 가진 데이터로 화면에 출력되지 않는다.

3.1 title 태그

문서의 제목을 정의. 정의된 제목은 브라우저의 탭에 출력된다.

<!DOCTYPE html>
<html>
    <head>
        <title>브라우저 탭에 표시되는 제목</title>
    </head>
</html>

3.2 style 태그

HTML문서에서 사용되는 스타일을 정의하는 정보를 정의.

<!DOCTYPE html>
<html>
    <head>
        <title>브라우저 탭에 표시되는 제목</title>
        <style>
          body {
            background-color: black;
            color: white;
          }
        </style>
    </head>
    <body>
    </body>
</html>

3.3 link 태그

link 요소는 외부 문서를 연결화는 태그.

주로 css같은 파일을 연결. 폰트 주소를 연결할 수도 있다.

<!DOCTYPE html>
<html>
    <head>
        <title>브라우저 탭에 표시되는 제목</title>
        <link rel='stylesheet' type='text/css' href='sample.css'>
    </head>
    <body>
    </body>
</html>

3.4 script 태그

자바스크립트 코드를 작성하는 공간이다.

src 어트리뷰트로 외부 자바스크립트 파일을 불러올 수 있다.

3.5 meta 태그

메타 데이터 정의시 사용. 메타데이터는 브라우저, 검색엔진 등에 의해 사용된다.

charset으로 문자셋을 정의할 수 있다.

검색엔진이 사용할 키워드를 정의할 수 있다.

웹페이지의 설명을 정의할 수 있다.

저자를 정의할 수 있다.

페이지 리프레시 주기를 정의할 수 있다.

4. body 태그

문서의 내용을 담는 곳 이다.

문서에 하나만 존재한다.

출처

https://poiemaweb.com/html5-tag-basic

'개발 > 웹' 카테고리의 다른 글

[HTML] 3. 시맨틱 웹 (0)	2019.12.19
[HTML] 2. HTML5 기본 문법 (0)	2019.12.18
[HTML] 1. 프런트엔드 개발자 학습 방향 (0)	2019.12.17

개발뚱땅