반응형

html 텍스트 관련 태그 정리

1) hn 태그 - 제목 표시하기

- 일반 텍스트보다 굵고 진하게 표시

- heading의 첫 글자인 'h'와 크기를 나타내는 숫자(1 ~ 6)를 사용하여 <h1> ~ <h6>까지 표현한다.

- <h1>이 가장 큰 제목이고 <h6>이 가장 작은 제목이다.

 

2) p 태그 - 단락 만들기

- paragraph의 첫 글자인 'p'를 사용하여 텍스트 단락을 만드는 데 사용하는데 이때 단락이란 앞뒤에 줄 바꿈이 있는 텍스트 덩어리를 말한다.

- 텍스트 단락은 닫히는 태그인 </p> 태그를 만날 때까지 줄 바꿈 없이 텍스트를 한 줄로 표시하는데 텍스트의 줄이 브라우저의 창의 너비보다 길어질 경우 자동으로 줄 바꿈이 된다.

 

3) br 태그 - 줄 바꿈

- 입력하는 텍스트에서 줄 바꿈을 하더라도 웹 브라우저에서는 줄 바꿈 없이 한 줄로 표시되는데 웹 브라우저에서 줄 바꿈을 하려면 <br> 태그를 사용한다.

- break의 줄임말로 <br> 태그는 닫는 태그가 없다.

 

4) hr 태그 - 수평 줄 넣기

- horizontal의 줄임말로 수평 줄을 삽일할 때 사용하며 닫는 태그는 없다.

 

5) blockquote 태그 - 인용문 넣기

- blockquote 태그 안에 입력한 텍스트는 안으로 들여 써지므로 다른 텍스트와 구별된다.

- 일반적으로 다른 블로그나 사이트의 글을 인용할 경우 사용되며 인용한 사이트의 주소가 명확할 경우, cite 속성을 이용해 인용 사이트의 주소를 표시할 수 있다.

 

6) pre 태그 - 입력한 그대로 표시하기

- htm에서는 여러개의 공백을 넣어도 한개로 표시된다. 하지만 <pre> 태그를 사용할경우 소스에 표시한 공백이 그대로 브라우저에 표시된다.

- preformat의 줄임말을 사용한다.

 

태그 적용

 

** 태그 사용시 참고 url : https://html-css-js.com/html/tags/

 

HTML Tags - List With Examples

Listing HTML tags with previews, examples and demos. Categorized by their importance, whether they're HTML5, singleton and if it's recommended to use them.

html-css-js.com

반응형

'Web Programming > ----- HTML -----' 카테고리의 다른 글

[HTML] html의 기본  (0) 2021.10.19
반응형

html의 기본

1) html이란 무엇인가?

- html은 하이퍼텍스트 마크업 랭귀지(HyperText Markup Language)의 줄임말로 말 그대로 해석하면 하이퍼텍스트를 마크업 하는 언어이다. 즉, 웹에서 자유롭게 오갈 수 있는 웹 문서를 만드는 언어를 HTML이라고 한다.

- 컴퓨터에서 사용하는 모든 파일들은 확장자라는 이름으로 각각 고유의 형식을 가지고 있는데 html 또한 컴퓨터의 웹 사이트에 맞는 형식인 *. html을 붙여 사용하는 형식을 가지고 있다.

- 웹문서인 html 파일은 일반문서와 차이가 있는데 일반문서는 내용을 입력하는 프로그램과 내용을 확인하는 프로그램이 같지만 웹문서는 작성하는 프로그램(웹 편집기 web editor)과 내용을 확인하는 프로그램(web browser)이 다르다.

 

2) 웹 표준이란 무엇인가?

- 웹사이트를 만들 때 지켜야 하는 약속들을 정리한 것

- 웹 표준의 존재 이유는 다양한 브라우저에 맞는 사이트들을 각각 만들기에는 너무나 비효율적이고 많은 인적, 물리적 시간이 소요되기 때문에 웹 표준이란 것이 존재한다.

- 웹 표준을 지킴으로써 브라우저에 상관없이 웹 사이트를 볼 수 있고 웹 개발자 또는 디자이너들의 시간을 절약할 수 있다.

반응형

'Web Programming > ----- HTML -----' 카테고리의 다른 글

[HTML] html 텍스트 관련 태그 정리  (0) 2021.10.19

+ Recent posts