HTML and CSS Reference
In-Depth Information
As you can see in the browser output, the
<aside>
element isn't treated as special in any
way compared to the other elements used to structure your page. However, a little later you
can see how much more easily you can style the content by using semantic markup, such as
the
<aside>
element.
Using the
<igcaption>
and
<igure>
elements
The
<igcaption>
and
<igure>
elements, new in HTML5, provide the semantic elements neces-
sary for adding graphics and figures to webpages. These graphics and figures typically provide
a visual representation of information in the textual content and referenced by the text. You
often see such images in tutorials or textbooks in which the author directs the reader to a
specific figure. As an example, I've added some HTML to the end of the previous example:
<body>
…
<article>
…
<figure>
<img src="orange.jpg" style="width:50px; height:50px;"/>
<figcaption>Fig 1: A really juicy orange.</figcaption>
</figure>
</article>
</body>
This HTML code produces the output in Figure 1-8.
FIGURE 1-8
Using the
<figure>
element to add a graphic or figure to the page
Search WWH ::
Custom Search