웹개발 및 최신 테크 소식을 전하는 블로그, 웹이즈프리

HOME > html

figure 그리고 figcaption 태그 알아보기

Last Modified : 2015-11-05 / Created : 2015-11-05
6,464
View Count
html5의 큰 특징 중 하나가 바로 시멘틱 태그의 사용이라고 할 수 있죠. 그 중 하나인 figure 태그에 대하여 알아보겠습니다.


# figure 태그의 쓰임
figure 태그는 단독으로 사용할 수 있는 요소들... 특히 사진이나 일러스터등의 콘텐츠를 포함하는데 사용되는 시멘틱 요소입니다. 이 태그는 선택에따라 내부에 사용할 수 있는 태그로 figcaption 태그를 사용할 수 있습니다. 이 태그는 figure 태그의 콘텐츠가 어떤 내용을 담고 있는지 설명해 줍니다.

figure 태그는 aside 태그와 비교가 많이 됩니다. aside 태그 역시 시멘틱 태그로 쓰임이 비슷하나 메인 콘텐츠와 거의 상관없는 내용의 겨우 주로 사용하며 figure는 콘텐츠와 비슷한 내용도 포함될때 사용됩니다.


# figure 예제보기

<figure>
  <img src="test.jpg" />
  <figcaption>테스트 이미지 보여주기</figcaption>
</figure>



Previous

반응형 웹페이지를 가장 쉽게 만드는 팁과 노하우

Previous

[HTML 소스코드] 라디오 버튼 만들기, radio button