<!DOCTYPE html> <!-- HTML문서 형식 선언 : HTML5형식이라는걸 알려주기 위한 태그 -->
<html lang="ko"> <!--
html문서의 시작과 끝을 표시해주는 태그
lang속성은 이 문서가 어느 나라 언어로 되어있는지 표시
-->
<!--
<head> 머리부를 나타냄 : 해당 이 문서의 각종 정보와 제목, 설명 및 스크립트, 스타일시트의 링크 선언하는 구문
<title>, <meta>, <link>, <style>, <script>
-->
<head>
<meta charset="UTF-8">
<meta name="generator" content="VScode"> <!--generator : 이 문서를 생성한 프로그램-->
<meta name="author" content="sunyoung"> <!--author : 이 문서의 저자-->
<meta name="keywords" content="글자,태그"> <!--keywords : 이 문서를 나타내는 키워드-->
<meta name="description" content="이 문서는 글자관련된 태그들을 공부하는 페이지입니다.">
<title>글자 관련 태그</title> <!--이 문서의 제목을 나타냄-->
</head>
<!--
<body> 몸체부를 나타냄 : 화면에 출력해서 보여주는 모든 정보/내용을 작성하는 구문
-->
<body>
안녕하세요 <br> <!--줄 바꿈 태그-->
반갑습니다
<br><br>
안녕히가세요
<!--h관련 태그 (h1 ~ h6)-->
<h1>h1 태그입니다.</h1>
<h2>h2 태그입니다.</h2>
<h3>h3 태그입니다.</h3>
<h4>h4 태그입니다.</h4>
<h5>h5 태그입니다.</h5>
<h6>h6 태그입니다.</h6>
<h7>h7 태그있나?</h7> <!--존재하지 않는 태그 사용시 : 일반글꼴-->
<hr>
<h3>문단을 나누는 태그</h3>
<p>
문단 영역을 나누는 태그로는 p 태그와 pre태그가 있다.
p태그는 줄바꿈입력을 별도의 태그로 지정해야된다. <br>
그리고 공백은 한 개의 공백만을 표시하기 때문에 기호문구를 작성해야된다.
</p>
<pre>
pre태그는 여러 공백 인식 가능하고
줄 바꿈 등을 포함하여 입력한 내용 그대로를 표현하는 태그
</pre>
<hr>
<h3>그 밖에 글자를 다루는 태그들</h3>
일반 글꼴 (태그로 감싸지지 않은 텍스트)
<br><br>
<b>b : 글자를 굵게 표시하는 태그</b>
<br><br>
<strong>strong : 글자를 굵게 표시하는 태그</strong>
<br><br>
<em>em : 글자를 기울여서 표시하는 태그</em>
<br><br>
<i>i : 기울여서 표시하는 태그</i>
<br><br>
<mark>mark : 형광펜</mark> 효과를 주는 태그
<br><br>
<u>u : 글자에 밑줄이 그어지는 태그</u>
<br><br>
<s>s : 글자에 취소선을 넣어주는 태그</s>
<br><br>
<strike>strike : 글자에 취소선을 넣어주는 태그</strike>
<br><br>
<small>small : 글자를 작게 표현해주는 태그</small>
<br><br>
<big>big : 글자를 크게 표현해주는 태그</big>
<br><br>
<abbr title="Internet Of Things">IOT</abbr> 란 각종 사물에 센서와 통신기능을 내장해서 인터넷에 연결하는 기술이다.
<br><br>
기본 글자에 <sub><b>아래첨자</b></sub>를 나타내는 태그와
<sup>윗첨자</sup>를 나타내는 태그이다.
<hr>
<h3>글자 관련 태그 응용</h3>
<p>
태그들은 해당 태그 내에서 중첩으로 사용 가능하다.
<b>굵은</b>글자를 사용할 수도 있고, <i>기울이거나, </i> <s>취소선</s>을 넣는 등 다양하게 사용할 수 있다.
<br>
<mark>형광펜</mark>을 넣어 글자를 강조할 수 있다.
</p>
</body>
</html>
'IT개발 과정 [취성패 학원] > Frontend' 카테고리의 다른 글
[HTML]03. 표관련태그 (0) | 2021.03.31 |
---|---|
[HTML]02. 목록관련태그 (0) | 2021.03.31 |