[HTML] HTML의 기본과 태그 종류

HTML은 Hyper Text Markup Language의 약자로 웹 페이지를 정의하는 마크업 언어

파일의 확장자는 .html/.htm으로 메모장에서도 작업 가능

HTML은 태그라는 명령어로 구성되고 각 태그는 속성으로 세부 설정이 가능

(태그 : <>)

기본적인 형태

<태그명>내용</태그명>

<태그명 속성="값">내용</태그명>

<태그명 속성1="값" 속성2="값">내용</태그명>

* 태그는 대소문자를 구분하지 않음

* 주석은 <!-- -->

태그의 종류

1. 영역 관련 태그

레이아웃을 구성하고자 할 때 사용하는 태그

<div></div> : 줄 바꿈이 적용됨

<span></span> : 줄 바꿈이 적용되지 않음. 영역이 옆으로 붙음

2. 글자입력, 단락구분 관련 태그

<h1></h1>~<h6></h6> : 제목(다른 내용과 분리될 수 있도록 위 아래 공백 한줄 추가), 1~6까지 있으면 글자 크기가 다름

<p></p> :  해당 태그의 단락 구분(내용상의 줄 바꿈은 출력시 적용되지 않는다)

<pre></pre> :  <p>태그와 유사하지만 입력 내용을 그대로 보여줌(내용상의 줄 바꿈이 적용)

<br/> : 줄 바꿈

<hr/> : 경계선

3. 글자 서식 태그

<b></b> : 진하게 출력

<em></em> : 강조

<small></small> : 작게 출력

<big></big> : 크게 출력

<strong></strong> : 굵게

 : 아래 첨자

 : 위 첨자

<ins></ins> : 밑줄

<del></del> : 관통하는 줄

4. 페이지 이동, 이미지 출력, 리스트 태그

<a href="url"></a> : 해당 url로 페이지 이동

<img src="url" /> : 해당 url에 있는 이미지를 불러옴

<ul></ul> : 순서 없는 리스트

<ol></ol> : 순서 있는 리스트

<li></li> : 리스트 안의 항목

5. 테이블 태그

<table></table> : 테이블 정의

[<tr></tr> : 행

<td></td> : 열

<thead></thead> : 테이블 영역. 테이블 태그 내에 한개만 존재 가능

<tbody></tbody> : 테이블 영역

<tfoot></tfoot> : 테이블 영역. 테이블 태그 내에 한개만 존재 가능

6. 폼 태그

<form></form> : 사용자가 입력한 데이터를 수집하여 서버로 전송하는 역할