텍스트 레벨 요소는 텍스트 정보를 명확하게 표현하기 위해 사용하는 요소들이다.
<sup> / <sub> : 요소는 위 / 아래 첨자를 표현한다. 수학식, 화학식, 각주, 단위 표시 등에 사용된다.
<abbr> : abbreviation 요소는 축약어나 약칭을 나타내는 데 사용한다. 이때 title 속성을 사용하여 약어의 내용을 이해할 수 있는 추가정보를 제공할 수 있다. 실제화면에서는 텍스트 아래 점선줄이 표현되며 마우스를 올려놓게 되면 title속성에 작성한 내용을 확인할 수 있다.
<time> : 요소는 날짜와 시간 정보를 표현하는 데 사용된다. 이 요소는 날짜 및 시간의 의미를 명확히 하기 위해 datetime 속성을 사용할 수 있다. time 요소를 사용하면 검색엔진이나 스크린리더가 날짜 시간데이터를 읽을 수 있도록 한다.
<mark> : 요소는 하이라이트 된 텍스트를 나타내며, 주로 검색 결과나 중요한 정보를 하이라이트 하는 용도로 사용한다.
<s> : 요소는 텍스트가 더 이상 유효하지 않거나 잘못된 정보를 나타낼 때 사용된다. 일반적으로 취소선으로 표시되어, 해당 텍스트가 더 이상 적용되지 않음을 나타낸다.
<small> : 요소는 텍스트의 크기를 줄여서 표시하며, 일반적으로 부가적인 정보나 주석을 나타내는 데 사용된다. 이때 부가 정보는 저작권 정보나 주석, 설명 등을 예로 들 수 있다.
<body>
<h1>텍스트 레벨 요소</h1>
<!-- <sub> 아래 첨자 <sup> 위 첨자 -->
<p>H<sub>2</sub>SO<sup>4</sup></p>
<div>
<!-- 축약어, title 속성으로 원문 전부를 알려준다. -->
<abbr title="Hyper Text Markup Language">HTML</abbr>
</div>
<!-- 날짜와 시간 정보 -->
<div>
<time datetime="2025-02-18T10:27:39">2025년 2월 18일</time>
</div>
<!-- 취소선 -->
<div>정상가<s>100000₩</s></div>
<!-- 저작권 정보 -->
<div>
<small>copyright © Likelion Bootcamp 2025</small>
</div>
<!-- 관련 참조 목적의 하이라이트 -->
<div>
<mark>HTML</mark>
</div>
</body>
'Coding > HTML & CSS' 카테고리의 다른 글
| HTML - picture, source 요소 (0) | 2025.02.27 |
|---|---|
| HTML - address 요소 (0) | 2025.02.27 |
| HTML - 섹션과 메인 요소 (0) | 2025.02.26 |
| HTML - 컨테이너 요소 (0) | 2025.02.26 |
| HTML - table 요소 (0) | 2025.02.26 |