[HTML] 특수기호 - HTML Entities

2020. 8. 31. 21:30HTML, CSS/HTML

 

▶ HTML Entities

 

  - 화면상에 'Hello world!'라는 문구를 출력하고 싶은 상황을 가정.

  - 이때 Hello와 world! 사이에 띄어쓰기를 여러 개 넣고 싶다면?

 

HTML Entities 사용 예시(1)

 

  - HTML에서 띄어쓰기는 여러 번 입력되더라도 화면상에는 한 번만 압축되어 출력됨.
  -  는 HTML의 특수기호로 한 번의 띄어쓰기를 의미함.

  - 원하는 만큼의 띄어쓰기가 들어갈 부분에  를 추가하여 처리할 수 있음. 

 

 

 

HTML Entities 사용 예시(2)

  - <div></div>가 하나의 제목으로 출력되기 원하는 상황을 가정.

  - 가장 왼쪽 이미지의 코드는 화면상에 아무것도 출력되지 않음. <div>가 있는 부분의 코드가 HTML이 읽혀지는 실질적인 <div> 코드로 작성되어 있기 때문.

  - 꺽쇠괄호(<, >)가 열리고 닫히는 부분을 포함시켜 화면상에 출력시키고 싶다면 HTML Entities로 새롭게 작성 가능.

  - 열리는 꺽쇠괄호(<)는 &lt;

  - 닫히는 꺽쇠괄호(>)는 &gt;
  - 가운데 이미지의 코드와 같이 작성 시 <, >가  텍스트로 화면에 출력됨.

  - HTML에서 명령으로 읽힐 수 있는 코드를 특수기호를 통해 텍스트로 출력 가능하도록 작성 가능.

 

HTML Entities List: www.freeformatter.com/html-entities.html

 

 

 

 

 

'HTML, CSS > HTML' 카테고리의 다른 글

[HTML] 주석  (0) 2020.08.31
[HTML] 전역 속성(7) - tabindex  (0) 2020.08.30
[HTML] 전역 속성(6) - draggable, hidden  (0) 2020.08.30
[HTML] 전역 속성(5) - data  (0) 2020.08.30
[HTML] 전역 속성(4) - lang  (0) 2020.08.30