HTML 태그 정리
시맨틱 태그
<header> 태그
-헤더 영역을 의미
-검색 창, 사이트 메뉴 등 삽입
<nav> 태그
-네비게이션 영역 의미
-다른 위치로 연결하는 링크 생성
<main> 태그
-메인 콘텐츠 삽입
-웹 문서마다 다르게 보여주는 내용으로 구성
-문서 당 한 번만 사용 가능
<article> 태그
-독립적 콘텐츠 삽입
-문서 안에 여러개 사용 가능
-내부에 <section> 태그 사용가능
<section> 태그
-콘텐츠 영역
-몇 개의 콘텐츠를 묶는 용도로 사용
<aside> 태그
-사이드 바 영역
<footer> 태그
-푸터 영역 생성
-<header>, <section>, <article> 등 시맨틱 태그 모두 사용 가능
<div> 태그
-여러 소스를 묶음
-id, class 속성 사용 가능
일반태그
텍스트 입력
<hn> 태그
-제목 나타냄
-n에 1~6까지의 수 삽입 가능, 숫자에 따라 크기 달라짐
<p> 태그
-텍스트 단락
<br> 태그
-줄바꿈 태그
-닫는 태그 없이 단독으로 사용됨
<blockquote> 태그
-인용문 인식할 수 있게 함
<strong>, <b> 태그
-텍스트 굵게 표시
-strong의 경우 화면 낭독기가 강조해 읽음
<em>, <i> 태그
-이탤릭체 표시
-em 태그는 강조
목록 생성
<ol>,<li> 태그
-ordered list, 순서 있는 목록
-type 지정 가능
| type="1" | 숫자(기본값) |
| type="a" | 영문 소문자 |
| type="A" | 영문 대문자 |
| type="i" | 로마 숫자 소문자 |
| type="I" | 로마 숫자 대문자 |
-start 속성 사용 가능
<ol start="3">
<li>3으로 번호 시작<li>
</ol>
<ul>, <li> 태그
-unordered list, 순서 없는 목록
표 구성
<table>, <caption> 태그
-table 태그는 표의 시작과 끝 표시
-caption 태그를 이용해 표의 제목 표시 가능
<tr>, <td> 태그
-tr 태그는 행을 생성
-td 태그는 행 안의 셀을 만듦
<th> 태그
-표의 제목 행을 만들 때 tr 태그 대신 사용
-진하게 표시되고 셀 중앙에 배열됨
<thread>, <tbody>, <tfoot> 태그
-각각 표의 제목, 본문, 요약을 나타냄
-태그로 tr 태그 묶어 사용
<rowspan>, <clospan> 태그
-각각 행과 열을 합침
<td rowspan="합칠 셀의 개수">셀 내용</td>
<td colspan="합칠 셀의 개수">셀 내용</td>