Search within TutorialsPark

HTML Figcaption


Use new HTML5 features to define figures and their Caption.


Angry birds Real
Figure Caption: Angry Birds

.

Figure Element :<figure>

1. HTML element <figure> is used to contain images and associate a caption to it.

2. You can even have multiple images within a single <figure> element as long as they have a same caption

3.The <figure> element is self contained within itself and can be moved away from the main flow of the document without affecting the flow of the document.

4. A <figure> element usually contains a <figcaption> within it to add a caption to the image.

Example: Simple usage of <figure> element.

Give it a TRY! »


Figure Caption :<figcaption>

1.HTML5 element <figcaption> enables you to add caption to your image.Such feature was not available in HTML versions.

2.The <figure> element should be used as a parent to element <figcaption>, encapsulating it.

3.The <figcaption> element should be the first or last child inside the <figure> element.

Example: Adding a Caption with element <figcaption>

Give it a TRY! »