태그, 글자태그

2023. 6. 16. 09:04Front/HTML

1. 태그

1) Block tag : <p>, ...

- 컨텐츠 길이에 상관없이 공간 전체 넓이의 한 줄을 차지

- 대부분 열어주는 태그, 닫는 태그가 있는 태그들은 Block tag

2) Inline tag : <b>, <em>, ...

- 가진 컨텐츠의 넓이 만큼만 차지

- 단독 태그들이 대부분 Inline tag

​- Inline tag를 공간 넓이 만큼 차지하게 하는 법

Block tag로 Inline tag를 감싸 한 줄을 잡아준다. 문단을 잡아주는 경우 사용

<p>

   <b>Bold</b>

</p>

2. 글자 태그

1) 제목 (Heading) 태그

<h숫자> contents </h숫자>

- 숫자 1~6

- 통상적으로 h4~h6은 잘 쓰이지 않음

- 숫자가 작을수록 크기가 커짐

- 검색엔진에서 제목 태그는 중요한 의미로 받아들일 가능성 큼

2) 본문 태그

<p> </p> : 문단태그, 문단 나누기 (Paragragh)

<br> : Line Break, Enter같은 의미, 다른 태그 내부에 삽입 가능

<hr> : 수평줄 삽입, 다른 태그 내부에 삽입 불가능

&nbsp : 스페이스바 네번 사용과 같은 기능

3) 글자모양 태그 (텍스트 효과)

<b> : 굵은 글씨, 검색엔진에서 아무 의미가 없음

<strong> : 굵은 글씨, 검색엔진에서 중요 의미

<i> : 기울임, 검색엔진에서 아무 의미가 없음

<em> : 기울임, 검색엔진에서 중요 의미

<ins> : 밑줄 글자

<del> : 가운데 줄 글자 (취소선)

<sub> : 아래 첨자

<sup> : 위 첨자

<small>: 텍스트를 작게 표현

<mark>: 텍스트 형광펜 표시