html 기본 문서 만들기 7 - 특수한 문자, 기호, 심벌 입력하기
네 안녕하세요, 이번 포스팅에서는 특수한 문자나 기호, 심벌 등을 입력하는 방법에 대하여 알아보도록 하겠습니다.
우리가 웹 문서를 작성할 때 그냥 일반적인 방법으로 입력이 되지 않는 글자들이 여럿 있습니다.
그럴 경우에는 특별한 방법을 이용해서 표현을 해주어야 합니다.
그래서 이번 포스팅에서는 이러한 방법이 무엇이며,
어떤 식으로 그러한 문자들을 표현할 수 있는지 알아보도록 하겠습니다.
1. 엔터티 코드로 문자, 기호, 심벌 입력하기
우리가 유니코드를 사용하기 이전에는 특수문자를 입력하기 위해서 엔터티 코드와 아스키코드를 이용을 했었습니다.
그래도 요즘은 유니코드가 많이 발전을 해서 굳이 이런 걸 쓰지 않고도 쓸 수가 있는데,
그래도 일부 특수한 문자들은 웹 어딘가에서 끌어다 써도 되지 않아서
직접 코드를 입력해서 표현을 해야 합니다.
그래서 어떤 식으로 쓰는지 표를 통해 알아보도록 하겠습니다.
| 문자 | 엔터티 표현 | 코드 표현 |
| " | " | " |
| ' | ' | ' |
| < | < | < |
| > | > | > |
| & | & | & |
| 빈칸(공백) | |   |
| £ (리라기호, 파운드 기호) | £ | £ |
| √ (루트) | √ | √ |
| ∞ | ∞ | ∞ |
| ↑ | ↑ | ↑ |
| ÷(나누기 기호) | ÷ | ÷ |
| Σ(시그마, 수열의 합 기호) | ∑ | ∑ |
몇 가지 예시를 들어봤는데, 실제로는 이것보다 더 많습니다.
하지만 요즘은 크게 쓰질 않아서 참고만 하시면 될 것 같습니다.
그럼 이걸 이용해서 표현한 예제 코드를 한 번 작성해 보도록 하겠습니다.
<!DOCTYPE html>
<html lang="ko">
<head>
<meta charset="UTF-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>기호 넣기</title>
</head>
<body>
<h3>기호 넣기</h3>
<hr>
10 ÷ 2 = 5 <br>
√2 = 1.414 <br>
2 < 3 <br>
오늘 "Mariah Carey" 노래를 들었다.
<hr>
<p>종료 태그 </hr>를 사용하지 않습니다.</p>
</body>
</html>
여기에 보면 몇 개의 문자는 그냥 기호 그대로 쓰였는데,
그렇지 않은 아이들은 엔터티 코드로 표현이 된 걸 볼 수 있습니다.
요즘은 그래서 어지간한 기호들은 자체적으로 표현이 가능하다는 것이 바로 이 뜻입니다.
그럼 결과 화면을 같이 보도록 하겠습니다.
이런 식으로 표현이 됩니다.
여기에서 꺽쇠와 그 부분에 붙어있는 공백이 바로 표현이 되지 않았습니다.
이렇게 입력을 해보고 안 되는 것들만 엔터티나 아스키코드로 나타내면 됩니다.
여기까지 특수 기호나 문자, 심벌 등을 넣는 방법에 대하여 알아보았습니다.
다음 포스팅에서는 개발자의 포맷을 그대로 출력하는 방법에 대하여 알아보도록 하겠습니다.
긴 글 읽어주신 독자분들께 진심으로 감사합니다~
'html, css, 자바스크립트 > html' 카테고리의 다른 글
| html 기본 문서 만들기 9 - 텍스트 꾸미기 (0) | 2023.03.01 |
|---|---|
| html 기본 문서 만들기 8 - pre 태그를 이용하여 개발자의 포맷 그대로 출력하기 (0) | 2023.03.01 |
| html 기본 문서 만들기 6 - br 태그 이용하여 새로운 줄로 넘어가기(개행하기) (0) | 2023.03.01 |
| html 기본 문서 만들기 5 - hr 태그로 수평선 긋기 (0) | 2023.03.01 |
| html 기본 문서 만들기 4 - p 태그로 문단 나누기 (0) | 2023.02.28 |
댓글