이 블로그는 광고 클릭 수익으로 운영됩니다!
괜찮으시다면 광고 차단을 풀어주세요 ㅠㅠ

게시글

강좌8 - HTML - 2년 전 등록 / 일 년 전 수정

HTML 엔티티(entity)

이스케이프(escape), 이스케이핑(escaping)
조회수:
0
이 블로그는 광고 클릭 수익으로 운영됩니다!
괜찮으시다면 광고 차단을 풀어주세요 ㅠㅠ
이 블로그는 광고 클릭 수익으로 운영됩니다!
괜찮으시다면 광고 차단을 풀어주세요 ㅠㅠ

안녕하세요. 이번 시간에는 HTML 엔티티에 대해서 알아보겠습니다!

혹시 HTML 소스를 보다가  나 < 또는 >를 보신 적이 있나요? 이 문자들은 HTML 파일이 깨져서 나타나는 문자가 아닙니다. 바로 HTML 엔티티입니다.

HTML에서 태그를 표현할 때 다음과 같이 하곤 하죠.

<div>zero</div>

만약 태그 안의 내용물에 <를 넣고 싶다면 어떻게 해야 할까요? 보통 다음과 같이 하겠죠?

<div><zero</div>

하지만, 위와 같이 하면 제대로 나오지 않습니다. 바로 <는 HTML에서 태그의 시작을 알리는 문자이기 때문이죠. 따라서 HTML은 <를 보면 문자로 여기지 않고, 태그의 시작으로 여겨서 뒷 부분이 에러가 납니다. 이러한 특수 문자를 표현하기 위한 것이 HTML 엔티티입니다. <는 &lt;로 나타내면 제대로 나옵니다.

이렇게 특정 문자를 HTML로 변환하는 행위를 Escape(이스케이프)한다고 말합니다.

<div>&lt;zero</div>

비슷한 경우로 띄어쓰기가 있습니다. HTML에서는 아무리 띄어쓰기를 해도 하나의 띄어쓰기로만 인식합니다.

<div>         띄어       쓰기       </div>

그래서 만약 정말 두 칸 이상의 띄어쓰기가 필요할 경우에는 HTML 엔티티를 사용해야 합니다. &nbsp;입니다.

<div>&nbsp;&nbsp;&nbsp;띄어&nbsp;&nbsp;&nbsp;쓰기&nbsp;&nbsp;&nbsp;</div>

이제 띄어쓰기가 원하는 대로 됩니다. 여기서 퀴즈 하나를 내보겠습니다. 만약 &lt;라는 글자를 쓰고 싶을 때는 어떻게 할까요? &lt;를 곧이곧대로 치면 <로 변환되어버립니다. 이 때는 &를 변환해주어야 합니다. &는 &amp;로 변환합니다.

<div>&amp;lt;</div>

&amp;를 입력하려면 &amp;amp;로 써야하는 웃지 못할 상황이 생기기도 합니다. 하나 또 자주 하는 이스케이핑으로 큰따옴표가 있습니다. 큰 따옴표는 &quot;로 이스케이프합니다.

<div>&quot;zero&qout;</div>

자주 쓰이는 것들을 정리해보았습니다.

  • < -- &lt;
  • > -- &gt;
  • (띄어쓰기) -- &nbsp;
  • & -- &amp;
  • " -- &quot;
  • ' -- &apos;
  • © -- &copy;

기억해두시면 나중에 갑자기 HTML에서 문자가 나오지 않을 때 대처할 수 있을 겁니다.

다음 시간에는 비디오 태그오디오 태그, 아이프레임 같은 멀티미디어 태그에 대해 알아보겠습니다!

투표로 게시글에 관해 피드백을 해주시면 많은 도움이 됩니다. 오류가 있다면 어떤 부분에 오류가 있는지도 알려주세요! 잘못된 정보가 퍼져나가지 않도록 도와주세요.
Copyright © 2016- 무단 전재 및 재배포 금지

댓글

1개의 댓글이 있습니다.
2년 전
믿고보는 제로초님 HTML은 복습겸 볼꼐요