[HTML5] 04. 텍스트 요소들

04. 텍스트 요소들

​

1. 텍스트 요소들

​

- <blockquote>: 단락 들여쓰기

* quote: 인용

- <br>: 줄 바꿈

* br은 break(줄 바꿈)의 약자

- <h1> to <h6>: 제목 지정

* h는 heading(제목)의 약자, 숫자가 작을수록 글자가 큼

- <hr>: 수평선

* hr은 horizontal(수평선)의 약자

- <p>: 단락

* p는 paragraph(단락)의 약자

- <pre>: 작성한 형식 그대로 출력

* pre는 'pre-formatted(미리 정한 서식대로)'의 약자

- <q>: 인용

* q는 quote(인용)의 약자

​

2. 공백 및 특수문자 입력

​

공백 및 특수문자 입력과 관련하여서는 아래 사이트를 참조하기 바란다.

​

ASCII Table: https://www.ascii-code.com/

​

3. 텍스트 스타일

​

1) 물리적 스타일 요소들

​

글자의 물리적 모양을 지정하는 요소들을 말한다.

​

- <b>: 글자를 진하게, bold(굵은)의 약자

- <i>: 글자가 기울어진 형태로, italic(이택릭체)의 약자

- <s>: 글자 가운데 통과하는 선(취소선)을 표시, strikethrough(글자를 선을 그어 지우다)의 약자

- <small>: 글자가 기본 크기보다 작게 표시됨

​

- <sub>: 글자가 아래첨자로 표시, subscript(아랫첨자)의 약자

- <sup>: 글자가 윗첨자로 표시, superscript(윗첨자)의 약자

- <u>: 글자에 밑줄이 표시, underline(밑줄)의 약자

​

2) 논리적 스타일 요소들

​

글자의 논리적 의미가 부여되어 있는 요소들을 말한다.

​

- <abbr>: 축약형, abbreviation(축약)의 약자

- <address>: 주소

- <cite>: 작품 인용, 기울어진 형태

- <code>: 컴퓨터 코드

- <dfn>: 용어에 대한 정의, difinition(정의)의 약자

- <em>: 강조, emphasis(강조)의 약자

- <kbd>: 키보드로 입력한 내용, keyboard(키보드)의 약자

- <mark>: 강조

- <samp>: 프로그램 샘플, sample(샘플)의 약자

- <strong>: 중요, 글자가 진하게 표시

- <var>: 변수

​

4. 텍스트의 방향

​

- <bdi>: 텍스트의 읽는 방향이 다른 언어(아랍어나 히브리어 등)를 위하여 html5에서 새로 생긴 태그, bidirectional isolation(양방향 격리)의 약자

- <bdo>: 텍스트의 방향을 설정, bidirectional override(양방향 재정의)의 약자

​

참조: https://webzz.tistory.com/241

​

5. 컨텐츠 그룹핑

​

1) 인라인(inline) 요소: 입력하는 내용 만큼의 공간을 차지

​

- <img>: 이미지 삽입, image의 약자

- <span>: 텍스트 일부에 CSS적용, JS 조작시 사용, 폭(범위)의 뜻

- <strong>: 중요, 글자가 진하게 표시

​

2) 블록(block) 요소: 하나의 줄을 전부 차지

​

- <div>: 텍스트 지정 섹션에 CSS적용, JS 조작시 사용, division(분할)

- <h1> to <h6>: 제목 지정

- <p>: 단락

​

#HTML5

#html

#web

#웹

#text

#텍스트

#물리적스타일

#논리적스타일

#공백및특수문자입력

#태그

#tag

#텍스트요소

 

참고:

- HTML Text Tag: https://poiemaweb.com/html5-tag-text

HTML5 Tag - Text | PoiemaWeb

 

세상을 링크하라!!! 모든 링크를 한 자리에...
링크닷컴: https://linkdotcom.mycafe24.com/

유용한 링크, 링크닷컴 #무료 #링크사이트 #링크사이트