Front-End/HTML

[HTML] Ex03_글자태그.html

이뮨01 2023. 6. 10. 14:40

기본적으로 텍스트를 화면에 보여주는 태그들을 배우다.


<!DOCTYPE html>
<html lang="en">
<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>Document</title>
</head>
<body>
    <!--글자 관련 태그: b, i, strong, em, sub, sup -->
    <!-- b, strong 굵게, strong 시각 장애인을 위한 -->
    <b>b 태그</b>
    <strong>strong 태그</strong>
    <br>
    <i>i 태그</i>
    <em>em 태그</em>
    <p>안녕하세요 <sup>sup</sup> 
    </p>
    <p>안녕하세요 <sub>sub</sub></p>

</body>
</html>

결과

 


b 태그와 strong 태그는 텍스트를 굵게(Bold) 보여주는 태그이다.

i 태그와 em 태그는 텍스트를 기울어지게(Italic) 보여주는 태그이다.

같은 효과를 주는 태그가 2개가 있는 이유는 strong 태그와 em 태그는 시각장애인을 위한 웹 문서를 읽어주는 프로그램을 위해 사용한다.


 sup 태그와 sub 태그는 첨자 태그이다.

내가 이해하기 쉽게 생각한 것은 sup 태그는 up이 들어가 있으니 위 첨자, 자연스럽게 sub는 아래 첨자가 된다.