实用软件资讯

HTML 5 中的新元素


 

浏览器可以决定把这个边栏放在哪里(可能需要用一点儿 CSS 代码)。

figure

figure 元素代表一个块级图像,还可以包含说明。例如,在许多 developerWorks 文章中,可以看到清单 5 这样的标记;其结果见图 1。


清单 5. 用 HTML 4 编写的 developerWorks 图

以下是代码片段:[www.xlnv.net]
<a name="fig2"><b>Figure 2. Install Mozilla XForms dialog</b></a><br />
<img alt="A Web site is requesting permission to install the following item:
   Mozilla XForms 0.7 Unsigned"
  src="installdialog.jpg" border="0" height="317" hspace="5" vspace="5" width="331" />
<br />
 

图 1. Install Mozilla XForms dialog
A Web site is requesting permission to install the following item:
Mozilla XForms 0.7 Unsigned
 

在 HTML 5 中,可以按照更有语义性的方式编写这个图,见清单 6。


清单 6. 用 HTML 5 编写的 developerWorks 图

以下是代码片段:[www.xlnv.net]
<figure id="fig2">
  <legend>Figure 2. Install Mozilla XForms dialog</legend>
  <img alt="A Web site is requesting permission to install the following item:
    Mozilla XForms 0.7 Unsigned"
    src="installdialog.jpg" border="0" height="317" hspace="5" vspace="5" width="331" />
</figure>
 

 

最重要的是,浏览器(尤其是屏幕阅读器)可以明确地将图和说明联系在一起。

figure 元素不只可以显示图片。还可以使用它给 audiovideoiframeobjectembed 元素加说明。

dialog

dialog 元素表示几个人之间的对话。HTML 5 dt 元素可以表示讲话者,HTML 5 dd 元素可以表示讲话内容。所以,在老式浏览器中也可以以合理的方式显示对话。清单 7 显示在 Galileo 的 “Dialogue Concerning the Two Chief World Systems” 上的一段著名对话。


清单 7. 用 HTML 5 编写的 Galilean 对话

以下是代码片段:[www.xlnv.net]
<dialog>
<dt>Simplicius </dt>
    <dd>According to the straight line AF,
and not according to the curve, such being already excluded
for such a use.</dd>

<dt>Sagredo </dt>
    <dd>But I should take neither of them,
seeing that the straight line AF runs obliquely. I should
draw a line perpendicular to CD, for this would seem to me
to be the shortest, as well as being unique among the
infinite number of longer and unequal ones which may be
drawn from the point A to every other point of the opposite
line CD. </dd>

<dt>Salviati </dt>
    <dd><p> Your choice and the reason you
adduce for it seem to me most excellent. So now we have it
that the first dimension is determined by a straight line;
the second (namely, breadth) by another straight line, and
not only straight, but at right angles to that which
determines the length. Thus we have defined the two
dimensions of a surface; that is, length and breadth. </p>

<p> But suppose you had to determine a height—for
example, how high this platform is from the pavement down
below there. Seeing that from any point in the platform we
may draw infinite lines, curved or straight, and all of
different lengths, to the infinite points of the pavement
below, which of all these lines would you make use of? </p>
</dd>
</dialog>
希望看到您的想法,请您发表评论x