HTML and CSS Reference
In-Depth Information
After seeing such an example, you might wonder what the point is of this element,
because a
<span>
tag or maybe even an
<em>
tag could be used instead. Again, semantics is
the key to this element. It makes the meaning of HTML documents more obvious.
Indicating Dates and Time
Another semantic inline element,
time
, was introduced by HTML5 to indicate content that
is a date, time, or both. For example,
<p>
Today it is
<time>
2009-07-08
</time>
which is an interesting date.
</p>
as well as
<p>
An interesting date/time for SciFi buffs is
<time>
1999-09-13T09:15:00
</time>
!
</p>
would both be valid. The element should contain a date/time value that is in the format
YYYY-MM-DDThh:mm:ssTZD
, where the letters correspond to years, months, days, hours,
minutes, and seconds,
T
is the actual letter 'T,' and
ZD
represents a time zone designator of
either
Z
or a value like
+hh:mm
to indicate a time zone offset. However, it seems reasonable
that the
time
element would contain values that may not be in a common format but are
recognized by humans as dates. If you try something like
<p>
Right now it is
<time>
6:15
</time>
.
</p>
it may be meaningful to you but it does not conform to HTML5. To provide both human-
and machine-friendly date/time content, the element supports a
datetime
attribute, which
should be set to the previously mentioned date format of
YYYY-MM-DDThh:mm:ssTZD
. So,
the following example is meaningful because it provides both a readable form and a
machine-understood value:
<p>
My first son was born on
<time datetime="2006-01-13">
Friday the 13th
</time>
so it is my new lucky day.
</p>
O
NLINE
http://htmlref.com/ch2/time.html
Similar to
mark
, the
time
element has no predefined rendering, though you could
certainly define a look using CSS.
Inserting Figures
It is often necessary to include images, graphs, compound objects that contain text and
images, and so on in our Web documents, all of which usually are called figures. Long ago,
HTML 3 tried to introduce the
fig
element to represent such constructs; HTML5
reintroduces the idea with the more appropriately named
figure
element. A simple
example illustrates this new element's usage:
<figure id="fig1">
<dd>
<img src="figure.png" height="100" width="100"
