HTML과 문자 참조(character reference)

< / > ← 이런거 본 적 있지 않아?


Table Of Contents


  • HTML 문법
  • 문자 참조(character reference)

HTML 문법


HTML에서 <, >처럼 특수한 용도로 사용되는 문자들이 있다.

특히 <, >는 HTML의 요소를 열고 닫는 데 사용하기 때문에 해당 문자들을 텍스트로 출력하려면 문제가 생길 가능성이 높다.

예를 들어서

<p><p></p>

같은 구문을 HTML에 넣는다면, 실제 화면상에 나타나는 텍스트는 없을 것이다...

참고로 위 구문은 애초에 HTML 문법에도 맞지도 않는데, 아마 대부분의 브라우저는 알아서 잘 <p><p></p></p> 처럼 파싱해준다.

물론 HTML의 표준 스펙이 아니라 브라우저가 편의를 봐주는 것이기 때문에 이렇게 쓰면 안 된다.

문자 참조(character reference)


이런 상황에서 <, > 문자가 HTML로 파싱되지 않게 하려면 해당 문자에 대한 **문자 참조(character reference)**를 사용하면 된다.

  • 문자 참조는 numeric character reference와 character entity reference로 나뉜다.
    • 숫자 문자 참조(numeric character reference)
      • &# 뒤에 10진수나 16진수 숫자를 붙여서 나타낸다.
      • 유니코드 상에 정의된 문자라면 숫자 문자 참조로 참조할 수 있다.
      • ex) &#60<, &#xAC00
    • 문자 엔티티 참조(character entity reference)
      • &(앰퍼샌드)로 시작하여 ;(세미콜론)으로 끝난다.
      • 미리 정의된 일부 문자만 참조할 수 있다.
      • ex) &lt;<

자주 쓰는 문자들은 이렇다. 더 많은 문자 참조들은 wikipedia에서 볼 수 있다.

문자 문자 엔티티 참조 숫자 문자 참조(10진수) 숫자 문자 참조(16진수)
< &lt; &#60 &#x3C
> &gt; &#62 &#x3E
" &quot; &#34 &#x22
' &apos; &#96 &#x60
& &amp; &#38 &#x26

따라서

<p>&lt;p&gt;</p>

처럼 쓰면 원하는 결과물을 얻을 수 있다.