文档介绍：HTML5的结构和语义——语义性的块级元素(三)
2012-01-10 15:53:06     我来说两句 
收藏    我要投稿    [字体:小 大]
aside figure dialog
 
我在文章和书中一直使用前两个元素。第三个元素我不经常用,它主要用于书面文本。
 
aside
 
aside 元素代表说明、提示、边栏、引用、附加注释等,也就是叙述主线之外的内容。例如,在developerWorks 文章中,经常会看到用表格形式编写的边栏,见代码3 用HTML 4 编写的developerWorks 边栏。
 
以下是代码片段:[ ]
<table align="right" border="0" cellpadding="0" cellspacing="0" width="40%">
<tbody><tr><td width="10">
<img alt="" src="///" height="1" width="10"></td>
<td>
<table border="1" cellpadding="5" cellspacing="0" width="100%">
<tbody><tr><td bgcolor="#eeeeee">
<p><a name="xf-value"><span class="smalltitle">.xf-value</span></a></p>
<p>
The <code type="inline">.xf-value</code> selector used here styles the input
field value but not its label. This is actually inconsistent
with the current CSS3 draft. The example really should use the
<code type="inline">::value</code> pseudo-class instead like so:
</p>
<table border="0" cellpadding="0" cellspacing="0" width="100%">
<tbody><tr><td class="code-outline">
<pre class="displaycode">input::value { width: 20em; }
#ccnumber::value { width: 18em }
#zip::value { width: 12em }
#state::value { width: 3em }</pre>
</td></tr></tbody></table><br>
 
<p>
However, Firefox doesn't yet support this syntax.
</p>
</td></tr></table>
 
在HTML 5 中,可以按照更有意义的方式编写这个边栏,见代码4 用HTML 5 编写的developerWorks 边栏。
 
以下是代码片段:[ ]
<aside>
<h3>.xf-value</h3