본문 바로가기

Web 기초

HTML 빠른 정리

1. HTML

1) 정의

1> HyperText Markup Language

2> 웹 문서를 만들기 위해 약속된 언어

2) HyperText

1> 링크하는 기능

 

2. 태그

1) 태그 규칙

1> 시작과 종료 태그

- 여는 태그<>가 있으면 </>닫는 태그가 있다.

2> 태그는 중첩 사용이 가능하다.

3> HTML 상에서의 들여쓰기와 줄 바꿈의 큰 의미가 없다.

- 들여쓰기와 줄 바꿈을 하는 건 보기에 편하라고 하는 것

- 에디터를 사용하면 자동으로 해준다.

4> 대소문자 구분이 없다.

- 그냥 하나로 일관성 있게 입력하는 것이 좋다.

5> 태그 내 글자의 공백 처리 

- 태그 내에서 공백은 한 칸을 기준으로 하기 때문에 글자 사이에 2칸 띄우려면 태그 사용한다.)

 

2) 태그와 속성

- <'tag이름' '속성 이름' = '값> '내용' </'tag 이름>형태로 사용한다.

1> 예시: <img src = "rose.jpg">

2> 규칙

- 속성 이름은 언제나 소문자

- 속성 값은 언제나 따옴표로 감싼다.

 

2) 전체 구조

 

3. 기본 태그

0) <!DOCTYPE html>

: 현재 문서가 HTML5 문서임을 명시

1> markup 언어요 DTD 태그

 

1) <html>

: HTML 문서의 루트(root) 요소를 정의 

1> 위의 DTD를 제외한 전체를 이 태그로 둘러싼다.

 

2) <head>

: HTML 문서의 메타데이터(metadata)를 정의합니다.

1> metadata: HTML 문서에 대한 정보 / web browser에는 직접적으로 표현되지 않는 정보

2> HTML 문서의 속성을 지정하기 위한 태그

3> 이 태그 안에 title이나 메타 태그 등을 넣는다.

 

3) <title>

: HTML의 제목을 선언하는 태그

1> web browser의 툴바(toolbar)에 표시됩니다.

2> web browser의 즐겨찾기에(favorites)에 추가할 때 즐겨찾기의 제목이 되기도 합니다.

3> 검색 엔진의 결과 페이지에 제목으로 표시됩니다.

 

4) <body>

: HTML 문서의 본 모양을 나타내기 위한 태그

 

4. Text 관련 태그

1) <h1~6>

: 제목(heading)을 표시할 때 사용된다.

2) 문단

1> <p>

: 새 문단을 연다.

2> <br>

: 문단 내 줄바꿈 (line break)

3> <hr>

: 가로줄을 넣는다.

3) text 효과

1> <b>: 굵게

2> <i>: 이탤릭(italic)체

3> 

'Web 기초' 카테고리의 다른 글

CSS 빠른 정리  (0) 2020.03.13