안녕하세요! 오늘은 텍스트 관련 요소에 대해 살펴보겠습니다.
텍스트 관련 요소들은 말 그대로 글자에 태그를 주어 요소를 넣어주는 것입니다.
텍스트 관련 요소들 중 어떤 것이 있는지 한 번 표로 확인해보겠습니다!
💬텍스트 관련 요소
| 태그명 | 태그의 의미 및 특징 |
| <em> | 강조하고 싶은 텍스트를 정의하기 위한 태그이며 기울임체로 표시됩니다. |
| <strong> | 중요한 텍스트를 정의하기 위한 태그이며 굵은체로 표시됩니다. |
| <mark> | 주의 깊게 볼 텍스트 부분을 강조하기 위한 태그이며 노란색으로 표시됩니다. |
| <b> | 의미를 가지고 있지 않으며 단순히 텍스트를 굵은체로 표시합니다. |
| <small> | 주의 사항, 법적 제한, 저작권 등의 정의하기 위한 태그이며 작은 글씨로 표시됩니다. |
| <sub> | 아래첨자 텍스트를 정의하기 위한 태그입니다. |
| <sup> | 위첨자 텍스트를 정의하기 위한 태그입니다. |
테이블로만 보면 어떤 태그가 무슨 의미를 가지는지 아마 헷갈리실거에요~
따라서 예제를 통해 꼼꼼히 살펴볼게요!
예제 1)
See the Pen 텍스틑 관련 요소 예제 by YeoDaSeul4355 (@YeoDaSeul4355) on CodePen.
텍스트 요소 중 <em> 태그와 <strong> 태그는 의미가 비슷해 보일 수 있지만, <em> 태그의 경우 문장에서 어떤 단어를 강조하느냐에 따라 문맥의 의미가 달라질 수 있고 <strong> 태그는 문장에서 일반적으로 중요한 단어를 강조하기 때문에 문맥의 의미에 변화를 주지 않습니다.
물론 이렇게 html 에서 텍스트에 관련된 태그를 쓸 수 있지만, CSS에서도 가능하다는 점!
자세한 건 CSS 카테고리에서 다루도록 하겠습니다.
도움이 되셨다면 공감과 많은 댓글 부탁드릴게요~
728x90
반응형
