html<figure> <figcaption> Label Definition illustrated

Originally wanted to divide two articles to explain the figure, figcaption, but these two labels are defined text, so we together to explain, we can more easily accept.

Everyone in the writing XHTML, HTML often use a picture list, image + title or picture + title + simple Description . Previous general wording:

<li>

<p>title</P>
</li>

In the HTML5, a new label is more semantically defined in this list of images, which is the figure tag.

The definition given by the Consortium: The figure tag specifies separate stream content (images, charts, photos, code, and so on). The content of the figure element should be related to the main content, but if deleted, it should not affect the flow of the document.

Instance code:

<figure>
<p> the Lupu Bridge on the Huangpu River </p>
</figure>

Try it yourself.

Figure used to replace the original Li tag, p tag who to replace it? The answer is:figcaption

The definition given by the Figcaption: the label defines the caption of the figure Element (caption). The "figcaption" element should be placed in the position of the first or last child element of the "figure" element.

Then the code above becomes:

<figure>
<figcaption> the Lupu Bridge on the Huangpu River </figcaption>
</figure>

Try it yourself.

---------------------------------------------------------------------------

This is a very easy to understand label, and its usage is very clear. Even if it is simple, it is recommended that you write them yourself.

html<figure> <figcaption> Label Definition illustrated