HTML : Hyper Text Markup Language
웹 페이지를 구성하는 언어로, 페이지의 구조(디자인)와 기능을 결정하는데 사용
HTML 기본 구조
<!DOCTYPE html>
<html>
<head>
<title>제목</title>
</head>
<body>
<h1> 제목입니다 </h1>
</body>
</html><!DOCTYPE html>: 현재 문서가 HTML5 문서임을 명시<html>: HTML 문서의 root 요소를 정의<head>: 문서의 metadata를 정의
- metadata? HTML 문서에 대한 정보, 브라우저에는 직접 표현되지 않는 정보
-<title>,<style>,<meta>,<link>,<script>,<base>태그 등
-<title>: 브라우저의 toolbar에 표시, 즐겨찾기에 추가할 때 즐겨찾기의 제목이 되며, 검색 엔진의 결과 페이지에 제목으로 표시<body>: 웹 브라우저를 통해 보이는 내용(content) 부분<h1>~<h6>: heading 즉, 제목을 나타냄<p>: paragraph 즉, 단락을 나타냄
HTML 요소 구조
HTML 요소(element)는 여러 속성을 가질 수 있으며, 이러한 속성(attribute)은 해당 요소에 대한 추가적인 정보를 제공한다. 요소는 시작 태그로 시작하여 종료 태그로 끝난다.
<태그이름 속성명1="속성값1" 속성명2="속성값2"> 내용 </태그이름>
HTML 문서 태그
제목 (Heading)
- 가장 큰 크기의
<h1>태그부터 가장 작은<h6>태그까지 다양한 크기로 제목을 표현한다. <h>태그의 위아래로는 약간의 여백이 자동으로 삽입된다.- HTML 문서의 제목에 해당하는 부분을
<big>태그나<bold>태그를 사용해 표현하지 않도록 한다.
단락 (Paragraph)
- 내용상 끊어서 구분할 수 있는 하나하나의 부분을 의미하며, 문단이라고도 한다.
<p>태그의 위아래로는 약간의 여백이 자동으로 삽입된다.<p>태그 내에서 작성된 여러 번의 띄어쓰기와 줄 나누기는 오직 하나의 띄어쓰기로 표현된다.<br>를 사용하면 새로운 단락을 만들지 않고 줄을 나눌 수 있다.(break line)- HTML 코드에서 작성한 서식을 그대로 표현하려면
<pre>태그를 사용해야 한다.(preformatted text) <hr>내용상의 구분을 표현할 때 수펴 가로 구분선을 사용한다.(horizontal rule)
서식 (Formatting)
- 강조효과 :
<b>,<strong> - 이탤릭체 :
<i>,<em> - 하이라이팅 효과 :
<mark> ~ </mark> - 중앙선(삭제) :
<del> ~ </del> - 삽입효과(밑줄) :
<ins> ~ </ins> - 위첨자, 아래첨자 :
<sup> ~ </sup>,<sub> ~ </sub>
인용구
- 참고 : TCPschool
