figure : html5에서 새로 추가된 태그
레벨 : 블록레벨
blockquote처럼 좌우에 여백이 있어서 들여쓰기처럼 나타난다.
blockquote 글씨위주의 작업을 하고 figure은 이미지나 박스 작업을 할 때 쓰인다. (별 차이는 없음)
blockquote는 제목을 쓸 수 없지만 figure는 가능
figcaption : figure의 제목
caption과의 차이점 - 위, 아래 배치 가능(작성 위치에 따라 위치 배치 가능. caption은 무조건 맨 위)
왼쪽정렬
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Document</title>
</head>
<body>
<figure>
<figcaption>제목1</figcaption>
<table border="1" cellspacing="0" cellpadding = "1">
<caption>요안도라 객실</caption>
<colgroup>
<col style="width: 100px;">
<col style="width: 150px;">
<col style="width: 100px;">
<col style="width: 200px;">
</colgroup>
<tbody>
<tr>
<th>방 이름</th>
<th>대상</th>
<th>크기</th>
<th>가격</th>
</tr>
<tr>
<th>유채방</th>
<td>여성도미토리</td>
<td rowspan="3">4인실</td>
<td rowspan="4">1인 20,000원</td>
</tr>
</tbody>
</table>
안녕하세요
</figure>
<blockquote>
안녕하세요
</blockquote>
안녕하세요
</body>
</html>