HTML5 글자 태그

글자 태그는 웹 페이지에서 가장 큰 비중을 차지한다.

 

제목 글자 태그

문서의 제목을 표현할 때 사용한다.

h는 heading(제목)을 의미한다.

태그	설명
h1	첫 번째로 큰 제목 글자 생성
h2	두 번째로 큰 제목 글자 생성
h3	세 번째로 큰 제목 글자 생성
h4	네 번째로 큰 제목 글자 생성
h5	다섯 번째로 큰 제목 글자 생성
h6	여섯 번째로 큰 제목 글자 생성

절대적인 글자 크기는 아니라서 동일한 태그여도 웹 브라우저의 종류가 다르면 글자 크기가 다를 수 있다.

한 웹 브라우저 내에서는 우선 순위에 따라 순차적으로 사용한다.

h1~h6 태그 사용

 

본문 글자 태그

p는 paragraph(단락), br은 break(줄 바꿈), hr은 horizontal rule(수평 줄)을 의미한다.

태그	설명
p	본문 문단 생성
br	줄 바꿈
hr	수평 줄 삽입

p 태그 사용

제목과 본문 태그 활용 예시

cf) 웹 표준에 따라 br 태그는 다른 글자 태그 내부에 삽입 가능하나 hr 태그는 웹 브라우저에 따라 불가능하다.

 

앵커 태그

하이퍼텍스트(HyperText)

- 사용자의 선택에 따라 특정 정보로 이동할 수 있도록 조직된 문서이다.

 

a 태그(Anchor)

- 다른 웹 페이지나 웹 페이지 내부의 특정 위치로 이동할 때 사용하는 태그이다.

- a 태그만으로는 이동하는 웹 페이지를 브라우저에게 알려줄 수 없어 href 속성을 사용한다.

*href(Hyper Reference)

태그	설명
a	하이퍼링크 생성

사용 예시: <a href="https://www.tistory.com/">티스토리</a>

 

a 태그의 href 속성

1. 절대 경로

- https://www.tistory.com

- /animal.jpg

2. 상대 경로

- animal.jpg

- image/animal.jpg

- ../animal.jpg

3. 아이디 경로

- #name (id 속성이 name인 태그의 위치로 이동)

4. 메일 경로

- mailto: h@daum.net (해당 주소로 메일 전송)

 

글자 모양 태그

웹 페이지의 글자에 형태나 의미를 부여하는데 사용하는 태그이다.

태그	설명	의미
b	굵은 글자	bold
i	기울어진 글자	italic
small	작은 글자	small
sub	아래 첨자	subscript
sup	위 첨자	superscript
ins	밑줄 글자	insert
del	취소선이 그어진 글자	delete

글자 모양 태그 내부에 제목 글자 태그와 본문 글자 태그는 넣을 수 없다.

b, i, small, sub, sup, ins, del 태그 순

 

[참고] HTML5 웹 프로그래밍 입문(3판)