2021-04-18
html 에는 <h1 ~ h6> 태그 외에도 텍스트에 효과를 주는 태그들이 몇가지 존재하는데 오늘이 이 태그들을 알아보자.
- 예제 html
예제에는 기본적으로 div 태그에 폰트사이즈 속성만 부여하였다.
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title>Insert title here</title>
<style type="text/css">
div{
font-size: 30px;
}
</style>
</head>
<body>
<div> Hello World</div>
</body>
</html>
- <strong>
<div><strong>Hello World</strong></div>
strong 기본적으로 텍스트 작업시 자주 쓰는 단축키 ctrl + b 정도로 생각하면 되며, 글자의 기본 굵기가 증가하게된다.
<div><b>Hello World</b></div>
<b> 태그를 써도 보여지는 결과물은 <strong> 태그와 같다.
- <i>
<div><i>Hello World</i></div>
i 태그는 italic 이라는 의미를 가지며, 텍스트에 기울임 효과를 준다.
<div><em>Hello World</em></div>
<em> 태그 역시 기울임 효과를 주며, 보여주는 결과물을 i 태그와 같다.
- <small>
<div><small>Hello World</small></div>
small 태그는 말그대로 텍스트의 크기가 축소되어 결과물을 나타낸다.
-<mark>
<div><mark>Hello World</mark></div>
mark 태그는 기본 택스트 영역에 노락색 백그라운드가 생기게 되어 특정 포인트를 강조할 수 있게 된다.
-<del>
<div><del>Hello World</del></div>
del 지정한 텍스트 영역에 빗금처리가 되도록 해준다.
-<ins>
<div><ins>Hello World</ins></div>
ins는 텍스트에 밑줄을 그어준다.
메인 이미지 출처: Photo by Parrish Freeman on Unsplash