diff options
Diffstat (limited to 'files/zh-cn/web/guide/html/html5')
3 files changed, 1 insertions, 761 deletions
diff --git a/files/zh-cn/web/guide/html/html5/html5_element_list/index.html b/files/zh-cn/web/guide/html/html5/html5_element_list/index.html deleted file mode 100644 index 9a45c3ba52..0000000000 --- a/files/zh-cn/web/guide/html/html5/html5_element_list/index.html +++ /dev/null @@ -1,591 +0,0 @@ ---- -title: HTML5 标签列表 -slug: Web/Guide/HTML/HTML5/HTML5_element_list -tags: - - HTML - - HTML5 - - Web - - 初学者 - - 指南 -translation_of: Web/HTML/Element -translation_of_original: Web/Guide/HTML/HTML5/HTML5_element_list ---- -<p>这里列出了所有<strong>标准化的 HTML5 元素</strong>，使用起始标签描述，按照功能分组。与列出所有标准化的、非标准化的、有效的、废弃的标签的 <a href="/zh-CN/docs/HTML/Element" title="HTML/Element">HTML 元素索引</a> 不同的是，该页只列出有效的 HTML5 元素。新网站应当只使用这里列出的元素。</p> - -<p>符号 <a href="/zh-CN/docs/HTML/HTML5"><img alt="这个元素在 HTML5 中加入" src="/files/3843/HTML5_Badge_32.png" style="height: 16px; vertical-align: middle; width: 16px;" title="这个元素在 HTML5 中加入"></a> 代表该元素是在 HTML5 中新增的。另外注意，这里列出的其他元素可能在 HTML5 标准中得到了扩充或经过修改。</p> - -<h2 id="根元素">根元素</h2> - -<table class="standard-table"> - <thead> - <tr> - <th scope="col">Element</th> - <th scope="col">Description</th> - </tr> - </thead> - <tbody> - <tr> - <td>{{HTMLElement("html")}}</td> - <td>代表 HTML 或 XHTML 文档的根。其他所有元素必须是这个元素的子节点。</td> - </tr> - </tbody> -</table> - -<h2 id="文档元数据">文档元数据</h2> - -<table class="standard-table"> - <thead> - <tr> - <th scope="col">Element</th> - <th scope="col">Description</th> - </tr> - </thead> - <tbody> - <tr> - <td>{{HTMLElement("head")}}</td> - <td>代表关于文档元数据的一个集合，包括脚本或样式表的链接或内容。</td> - </tr> - <tr> - <td>{{HTMLElement("title")}}</td> - <td>定义文档的标题，将显示在浏览器的标题栏或标签页上。该元素只能包含文本，包含的标签不会被解释。</td> - </tr> - <tr> - <td>{{HTMLElement("base")}}</td> - <td>定义页面上相对 URL 的基准 URL。</td> - </tr> - <tr> - <td>{{HTMLElement("link")}}</td> - <td>用于链接外部资源到该文档。</td> - </tr> - <tr> - <td>{{HTMLElement("meta")}}</td> - <td>定义其他 HTML 元素无法描述的元数据。</td> - </tr> - <tr> - <td>{{HTMLElement("style")}}</td> - <td>用于内联 CSS。</td> - </tr> - </tbody> -</table> - -<h2 id="脚本">脚本</h2> - -<table class="standard-table"> - <thead> - <tr> - <th scope="col">Element</th> - <th scope="col">Description</th> - </tr> - </thead> - <tbody> - <tr> - <td>{{HTMLElement("script")}}</td> - <td>定义一个内联脚本或链接到外部脚本。脚本语言是 JavaScript。</td> - </tr> - <tr> - <td>{{HTMLElement("noscript")}}</td> - <td>定义当浏览器不支持脚本时显示的替代文字。</td> - </tr> - <tr> - <td>{{HTMLElement("template")}}<a href="/zh-CN/docs/HTML/HTML5"><img alt="这个元素在 HTML5 中加入" src="/files/3843/HTML5_Badge_32.png" style="height: 16px; vertical-align: middle; width: 16px;" title="这个元素在 HTML5 中加入"></a></td> - <td>通过 JavaScript 在运行时实例化内容的容器。</td> - </tr> - </tbody> -</table> - -<h2 id="章节">章节</h2> - -<table class="standard-table"> - <thead> - <tr> - <th scope="col">Element</th> - <th scope="col">Description</th> - </tr> - </thead> - <tbody> - <tr> - <td>{{HTMLElement("body")}}</td> - <td> - <div>代表 HTML 文档的内容。在文档中只能有一个 <code><body></code> 元素。</div> - </td> - </tr> - <tr> - <td>{{HTMLElement("section")}} <a href="/zh-CN/docs/HTML/HTML5"><img alt="这个元素在 HTML5 中加入" src="/files/3843/HTML5_Badge_32.png" style="height: 16px; vertical-align: middle; width: 16px;" title="这个元素在 HTML5 中加入"></a></td> - <td>定义文档中的一个章节。</td> - </tr> - <tr> - <td>{{HTMLElement("nav")}} <a href="/zh-CN/docs/HTML/HTML5"><img alt="这个元素在 HTML5 中加入" src="/files/3843/HTML5_Badge_32.png" style="height: 16px; vertical-align: middle; width: 16px;" title="这个元素在 HTML5 中加入"></a></td> - <td>定义只包含导航链接的章节。</td> - </tr> - <tr> - <td>{{HTMLElement("article")}} <a href="/zh-CN/docs/HTML/HTML5"><img alt="这个元素在 HTML5 中加入" src="/files/3843/HTML5_Badge_32.png" style="height: 16px; vertical-align: middle; width: 16px;" title="这个元素在 HTML5 中加入"></a></td> - <td>定义可以独立于内容其余部分的完整独立内容块。</td> - </tr> - <tr> - <td>{{HTMLElement("aside")}} <a href="/zh-CN/docs/HTML/HTML5"><img alt="这个元素在 HTML5 中加入" src="/files/3843/HTML5_Badge_32.png" style="height: 16px; vertical-align: middle; width: 16px;" title="这个元素在 HTML5 中加入"></a></td> - <td>定义和页面内容关联度较低的内容——如果被删除，剩下的内容仍然很合理。</td> - </tr> - <tr> - <td><a href="/zh-CN/docs/HTML/Element/Heading_Elements"><code><h1>,<h2>,<h3>,<h4>,<h5>,<h6></code></a></td> - <td>标题元素实现了六层文档标题，<code><h1></code> 是最大的标题，<code><h6></code> 是最小的标题。标题元素简要地描述章节的主题。</td> - </tr> - <tr> - <td>{{HTMLElement("header")}} <a href="/zh-CN/docs/HTML/HTML5"><img alt="这个元素在 HTML5 中加入" src="/files/3843/HTML5_Badge_32.png" style="height: 16px; vertical-align: middle; width: 16px;" title="这个元素在 HTML5 中加入"></a></td> - <td>定义页面或章节的头部。它经常包含 logo、页面标题和导航性的目录。</td> - </tr> - <tr> - <td>{{HTMLElement("footer")}} <a href="/zh-CN/docs/HTML/HTML5"><img alt="这个元素在 HTML5 中加入" src="/files/3843/HTML5_Badge_32.png" style="height: 16px; vertical-align: middle; width: 16px;" title="这个元素在 HTML5 中加入"></a></td> - <td>定义页面或章节的尾部。它经常包含版权信息、法律信息链接和反馈建议用的地址。</td> - </tr> - <tr> - <td>{{HTMLElement("address")}}</td> - <td>定义包含联系信息的一个章节。</td> - </tr> - <tr> - <td>{{HTMLElement("main")}}<a href="/zh-CN/docs/HTML/HTML5"><img alt="这个元素在 HTML5 中加入" src="/files/3843/HTML5_Badge_32.png" style="height: 16px; vertical-align: middle; width: 16px;" title="这个元素在 HTML5 中加入"></a></td> - <td>定义文档中主要或重要的内容。</td> - </tr> - </tbody> -</table> - -<h2 id="组织内容">组织内容</h2> - -<table class="standard-table"> - <thead> - <tr> - <th scope="col">Element</th> - <th scope="col">Description</th> - </tr> - </thead> - <tbody> - <tr> - <td>{{HTMLElement("p")}}</td> - <td>定义一个段落。</td> - </tr> - <tr> - <td>{{HTMLElement("hr")}}</td> - <td>代表章节、文章或其他长内容中段落之间的分隔符。</td> - </tr> - <tr> - <td>{{HTMLElement("pre")}}</td> - <td>代表其内容已经预先排版过，格式应当保留 。</td> - </tr> - <tr> - <td>{{HTMLElement("blockquote")}}</td> - <td>代表引用自其他来源的内容。</td> - </tr> - <tr> - <td>{{HTMLElement("ol")}}</td> - <td>定义一个有序列表。</td> - </tr> - <tr> - <td>{{HTMLElement("ul")}}</td> - <td>定义一个无序列表。</td> - </tr> - <tr> - <td>{{HTMLElement("li")}}</td> - <td>定义列表中的一个列表项。</td> - </tr> - <tr> - <td>{{HTMLElement("dl")}}</td> - <td>定义一个定义列表（一系列术语和其定义）。</td> - </tr> - <tr> - <td>{{HTMLElement("dt")}}</td> - <td>代表一个由下一个 <code><dd></code> 定义的术语。</td> - </tr> - <tr> - <td>{{HTMLElement("dd")}}</td> - <td>代表出现在它之前术语的定义。</td> - </tr> - <tr> - <td>{{HTMLElement("figure")}} <a href="/zh-CN/docs/HTML/HTML5"><img alt="这个元素在 HTML5 中加入" src="/files/3843/HTML5_Badge_32.png" style="height: 16px; vertical-align: middle; width: 16px;" title="这个元素在 HTML5 中加入"></a></td> - <td>代表一个和文档有关的图例。</td> - </tr> - <tr> - <td>{{HTMLElement("figcaption")}} <a href="/zh-CN/docs/HTML/HTML5"><img alt="这个元素在 HTML5 中加入" src="/files/3843/HTML5_Badge_32.png" style="height: 16px; vertical-align: middle; width: 16px;" title="这个元素在 HTML5 中加入"></a></td> - <td>代表一个图例的说明。</td> - </tr> - <tr> - <td>{{HTMLElement("div")}}</td> - <td>代表一个通用的容器，没有特殊含义。</td> - </tr> - </tbody> -</table> - -<h2 id="文字形式">文字形式</h2> - -<table class="standard-table"> - <thead> - <tr> - <th scope="col">Element</th> - <th scope="col">Description</th> - </tr> - </thead> - <tbody> - <tr> - <td>{{HTMLElement("a")}}</td> - <td>代表一个链接到其他资源的<em>超链接</em> 。</td> - </tr> - <tr> - <td>{{HTMLElement("em")}}</td> - <td>代表<em>强调</em> 文字。</td> - </tr> - <tr> - <td>{{HTMLElement("strong")}}</td> - <td>代表<em>特别重要</em> 文字。</td> - </tr> - <tr> - <td>{{HTMLElement("small")}}</td> - <td>代表<em>注释</em> ，如免责声明、版权声明等，对理解文档不重要。</td> - </tr> - <tr> - <td>{{HTMLElement("s")}}</td> - <td>代表<em>不准确或不相关</em> 的内容。</td> - </tr> - <tr> - <td>{{HTMLElement("cite")}}</td> - <td>代表<em>作品标题</em> 。</td> - </tr> - <tr> - <td>{{HTMLElement("q")}}</td> - <td>代表内联的<em>引用</em> 。</td> - </tr> - <tr> - <td>{{HTMLElement("dfn")}}</td> - <td>代表一个术语包含在其最近祖先内容中的<em>定义</em> 。</td> - </tr> - <tr> - <td>{{HTMLElement("abbr")}}</td> - <td>代表<em>省略</em> 或<em>缩写</em> ，其完整内容在 <code>title</code> 属性中。</td> - </tr> - <tr> - <td>{{HTMLElement("data")}} <a href="/zh-CN/docs/HTML/HTML5"><img alt="这个元素在 HTML5 中加入" src="/files/3843/HTML5_Badge_32.png" style="height: 16px; vertical-align: middle; width: 16px;" title="这个元素在 HTML5 中加入"></a></td> - <td>关联一个内容的<em>机器可读的等价形式</em> （该元素只在 WHATWG 版本的 HTML 标准中，不在 W3C 版本的 HTML5 标准中）。</td> - </tr> - <tr> - <td>{{HTMLElement("time")}} <a href="/zh-CN/docs/HTML/HTML5"><img alt="这个元素在 HTML5 中加入" src="/files/3843/HTML5_Badge_32.png" style="height: 16px; vertical-align: middle; width: 16px;" title="这个元素在 HTML5 中加入"></a></td> - <td>代表<em>日期</em> 和<em>时间</em> 值；机器可读的等价形式通过 <code>datetime</code> 属性指定。</td> - </tr> - <tr> - <td>{{HTMLElement("code")}}</td> - <td>代表<em>计算机代码</em> 。</td> - </tr> - <tr> - <td>{{HTMLElement("var")}}</td> - <td>代表<em>代码中的变量</em> 。</td> - </tr> - <tr> - <td>{{HTMLElement("samp")}}</td> - <td>代表程序或电脑的<em>输出</em> 。</td> - </tr> - <tr> - <td>{{HTMLElement("kbd")}}</td> - <td>代表<em>用户输入</em> ，一般从键盘输出，但也可以代表其他输入，如语音输入。</td> - </tr> - <tr> - <td>{{HTMLElement("sub")}},{{HTMLElement("sup")}}</td> - <td>分别代表<em>下标</em> 和<em>上标</em> 。</td> - </tr> - <tr> - <td>{{HTMLElement("i")}}</td> - <td>代表一段<em>不同性质</em> 的文字，如技术术语、外文短语等。</td> - </tr> - <tr> - <td>{{HTMLElement("b")}}</td> - <td>代表一段<em>需要被关注</em> 的文字。</td> - </tr> - <tr> - <td>{{HTMLElement("u")}}</td> - <td>代表一段需要<em>下划线</em>呈现的文本注释，如标记出拼写错误的文字等。</td> - </tr> - <tr> - <td>{{HTMLElement("mark")}} <a href="/zh-CN/docs/HTML/HTML5"><img alt="这个元素在 HTML5 中加入" src="/files/3843/HTML5_Badge_32.png" style="height: 16px; vertical-align: middle; width: 16px;" title="这个元素在 HTML5 中加入"></a></td> - <td>代表一段需要被高亮的<em>引用</em> 文字。</td> - </tr> - <tr> - <td>{{HTMLElement("ruby")}} <a href="/zh-CN/docs/HTML/HTML5"><img alt="这个元素在 HTML5 中加入" src="/files/3843/HTML5_Badge_32.png" style="height: 16px; vertical-align: middle; width: 16px;" title="这个元素在 HTML5 中加入"></a></td> - <td>代表被<em>ruby 注释</em> 标记的文本，如中文汉字和它的拼音。</td> - </tr> - <tr> - <td>{{HTMLElement("rt")}} <a href="/zh-CN/docs/HTML/HTML5"><img alt="这个元素在 HTML5 中加入" src="/files/3843/HTML5_Badge_32.png" style="height: 16px; vertical-align: middle; width: 16px;" title="这个元素在 HTML5 中加入"></a></td> - <td>代表<em>ruby 注释</em> ，如中文拼音。</td> - </tr> - <tr> - <td>{{HTMLElement("rp")}} <a href="/zh-CN/docs/HTML/HTML5"><img alt="这个元素在 HTML5 中加入" src="/files/3843/HTML5_Badge_32.png" style="height: 16px; vertical-align: middle; width: 16px;" title="这个元素在 HTML5 中加入"></a></td> - <td>代表 ruby 注释两边的<em>额外插入文本</em> ，用于在不支持 ruby 注释显示的浏览器中提供友好的注释显示。</td> - </tr> - <tr> - <td>{{HTMLElement("bdi")}} <a href="/zh-CN/docs/HTML/HTML5"><img alt="这个元素在 HTML5 中加入" src="/files/3843/HTML5_Badge_32.png" style="height: 16px; vertical-align: middle; width: 16px;" title="这个元素在 HTML5 中加入"></a></td> - <td>代表需要<em>脱离</em> 父元素文本方向的一段文本。它允许嵌入一段不同或未知文本方向格式的文本。</td> - </tr> - <tr> - <td>{{HTMLElement("bdo")}}</td> - <td>指定子元素的<em>文本方向</em> ，显式地覆盖默认的文本方向。</td> - </tr> - <tr> - <td>{{HTMLElement("span")}}</td> - <td>代表一段没有特殊含义的文本，当其他语义元素都不适合文本时候可以使用该元素。</td> - </tr> - <tr> - <td>{{HTMLElement("br")}}</td> - <td>代表<em>换行</em> 。</td> - </tr> - <tr> - <td>{{HTMLElement("wbr")}} <a href="/zh-CN/docs/HTML/HTML5"><img alt="这个元素在 HTML5 中加入" src="/files/3843/HTML5_Badge_32.png" style="height: 16px; vertical-align: middle; width: 16px;" title="这个元素在 HTML5 中加入"></a></td> - <td>代表<em>建议换行 (Word Break Opportunity)</em> ，当文本太长需要换行时将会在此处添加换行符。</td> - </tr> - </tbody> -</table> - -<h2 id="编辑">编辑</h2> - -<table class="standard-table"> - <thead> - <tr> - <th scope="col">Element</th> - <th scope="col">Description</th> - </tr> - </thead> - <tbody> - <tr> - <td>{{HTMLElement("ins")}}</td> - <td>定义<em>增加</em> 到文档的内容。</td> - </tr> - <tr> - <td>{{HTMLElement("del")}}</td> - <td>定义从文档<em>移除</em> 的内容。</td> - </tr> - </tbody> -</table> - -<h2 id="嵌入内容">嵌入内容</h2> - -<table class="standard-table"> - <thead> - <tr> - <th scope="col">Element</th> - <th scope="col">Description</th> - </tr> - </thead> - <tbody> - <tr> - <td>{{HTMLElement("img")}}</td> - <td>代表一张<em>图片</em> 。</td> - </tr> - <tr> - <td>{{HTMLElement("iframe")}}</td> - <td>代表一个<em>内联的框架</em> 。</td> - </tr> - <tr> - <td>{{HTMLElement("embed")}} <a href="/zh-CN/docs/HTML/HTML5"><img alt="这个元素在 HTML5 中加入" src="/files/3843/HTML5_Badge_32.png" style="height: 16px; vertical-align: middle; width: 16px;" title="这个元素在 HTML5 中加入"></a></td> - <td>代表一个<em>嵌入</em> 的外部资源，如应用程序或交互内容。</td> - </tr> - <tr> - <td>{{HTMLElement("object")}}</td> - <td>代表一个<em>外部资源</em> ，如图片、HTML 子文档、插件等。</td> - </tr> - <tr> - <td>{{HTMLElement("param")}}</td> - <td>代表 <code><object></code> 元素所指定的插件的<em>参数</em> 。</td> - </tr> - <tr> - <td>{{HTMLElement("video")}} <a href="/zh-CN/docs/HTML/HTML5"><img alt="这个元素在 HTML5 中加入" src="/files/3843/HTML5_Badge_32.png" style="height: 16px; vertical-align: middle; width: 16px;" title="这个元素在 HTML5 中加入"></a></td> - <td>代表一段<em>视频</em> 及其视频文件和字幕，并提供了播放视频的用户界面。</td> - </tr> - <tr> - <td>{{HTMLElement("audio")}} <a href="/zh-CN/docs/HTML/HTML5"><img alt="这个元素在 HTML5 中加入" src="/files/3843/HTML5_Badge_32.png" style="height: 16px; vertical-align: middle; width: 16px;" title="这个元素在 HTML5 中加入"></a></td> - <td>代表一段<em>声音</em> ，或<em>音频流</em> 。</td> - </tr> - <tr> - <td>{{HTMLElement("source")}} <a href="/zh-CN/docs/HTML/HTML5"><img alt="这个元素在 HTML5 中加入" src="/files/3843/HTML5_Badge_32.png" style="height: 16px; vertical-align: middle; width: 16px;" title="这个元素在 HTML5 中加入"></a></td> - <td>为 <code><video></code> 或 <code><audio></code> 这类媒体元素指定<em>媒体源</em> 。</td> - </tr> - <tr> - <td>{{HTMLElement("track")}} <a href="/zh-CN/docs/HTML/HTML5"><img alt="这个元素在 HTML5 中加入" src="/files/3843/HTML5_Badge_32.png" style="height: 16px; vertical-align: middle; width: 16px;" title="这个元素在 HTML5 中加入"></a></td> - <td>为 <code><video></code> 或 <code><audio></code> 这类媒体元素指定<em>文本轨道（字幕）</em> 。</td> - </tr> - <tr> - <td>{{HTMLElement("canvas")}} <a href="/zh-CN/docs/HTML/HTML5"><img alt="这个元素在 HTML5 中加入" src="/files/3843/HTML5_Badge_32.png" style="height: 16px; vertical-align: middle; width: 16px;" title="这个元素在 HTML5 中加入"></a></td> - <td>代表<em>位图区域</em> ，可以通过脚本在它上面实时呈现图形，如图表、游戏绘图等。</td> - </tr> - <tr> - <td>{{HTMLElement("map")}}</td> - <td>与 <code><area></code> 元素共同定义<em>图像映射</em> 区域。</td> - </tr> - <tr> - <td>{{HTMLElement("area")}}</td> - <td>与 <code><map></code> 元素共同定义<em>图像映射</em> 区域。</td> - </tr> - <tr> - <td>{{SVGElement("svg")}} <a href="/zh-CN/docs/HTML/HTML5"><img alt="这个元素在 HTML5 中加入" src="/files/3843/HTML5_Badge_32.png" style="height: 16px; vertical-align: middle; width: 16px;" title="这个元素在 HTML5 中加入"></a></td> - <td>定义一个嵌入式<em>矢量图</em> 。</td> - </tr> - <tr> - <td>{{MathMLElement("math")}} <a href="/zh-CN/docs/HTML/HTML5"><img alt="这个元素在 HTML5 中加入" src="/files/3843/HTML5_Badge_32.png" style="height: 16px; vertical-align: middle; width: 16px;" title="这个元素在 HTML5 中加入"></a></td> - <td>定义一段<em>数学公式</em> 。</td> - </tr> - </tbody> -</table> - -<h2 id="表格">表格</h2> - -<table class="standard-table"> - <thead> - <tr> - <th scope="col">Element</th> - <th scope="col">Description</th> - </tr> - </thead> - <tbody> - <tr> - <td>{{HTMLElement("table")}}</td> - <td>定义<em>多维数据</em> 。</td> - </tr> - <tr> - <td>{{HTMLElement("caption")}}</td> - <td>代表<em>表格的标题</em> 。</td> - </tr> - <tr> - <td>{{HTMLElement("colgroup")}}</td> - <td>代表表格中一组<em>单列或多列</em> 。</td> - </tr> - <tr> - <td>{{HTMLElement("col")}}</td> - <td>代表表格中的<em>列</em> 。</td> - </tr> - <tr> - <td>{{HTMLElement("tbody")}}</td> - <td>代表表格中一块<em>具体数据</em> （表格主体）。</td> - </tr> - <tr> - <td>{{HTMLElement("thead")}}</td> - <td>代表表格中一块<em>列标签</em> （表头）。</td> - </tr> - <tr> - <td>{{HTMLElement("tfoot")}}</td> - <td>代表表格中一块<em>列摘要</em> （表尾）。</td> - </tr> - <tr> - <td>{{HTMLElement("tr")}}</td> - <td>代表表格中的<em>行</em> 。</td> - </tr> - <tr> - <td>{{HTMLElement("td")}}</td> - <td>代表表格中的<em>单元格</em> 。</td> - </tr> - <tr> - <td>{{HTMLElement("th")}}</td> - <td>代表表格中的<em>头部单元格</em> 。</td> - </tr> - </tbody> -</table> - -<h2 id="表单">表单</h2> - -<table class="standard-table"> - <thead> - <tr> - <th scope="col">Element</th> - <th scope="col">Description</th> - </tr> - </thead> - <tbody> - <tr> - <td>{{HTMLElement("form")}}</td> - <td>代表一个<em>表单</em> ，由控件组成。</td> - </tr> - <tr> - <td>{{HTMLElement("fieldset")}}</td> - <td>代表<em>控件组</em> 。</td> - </tr> - <tr> - <td>{{HTMLElement("legend")}}</td> - <td>代表 <code><fieldset></code> 控件组的<em>标题</em> 。</td> - </tr> - <tr> - <td>{{HTMLElement("label")}}</td> - <td>代表表单控件的<em>标题</em> 。</td> - </tr> - <tr> - <td>{{HTMLElement("input")}}</td> - <td>代表允许用户编辑数据的<em>数据区</em> （文本框、单选框、复选框等）。</td> - </tr> - <tr> - <td>{{HTMLElement("button")}}</td> - <td>代表<em>按钮</em> 。</td> - </tr> - <tr> - <td>{{HTMLElement("select")}}</td> - <td>代表<em>下拉框</em> 。</td> - </tr> - <tr> - <td>{{HTMLElement("datalist")}} <a href="/zh-CN/docs/HTML/HTML5"><img alt="这个元素在 HTML5 中加入" src="/files/3843/HTML5_Badge_32.png" style="height: 16px; vertical-align: middle; width: 16px;" title="这个元素在 HTML5 中加入"></a></td> - <td>代表提供给其他控件的<em>一组预定义选项</em> 。</td> - </tr> - <tr> - <td>{{HTMLElement("optgroup")}}</td> - <td>代表一个<em>选项分组</em> 。</td> - </tr> - <tr> - <td>{{HTMLElement("option")}}</td> - <td>代表一个 <code><select></code> 元素或 <code><datalist></code> 元素中的一个<em>选项</em></td> - </tr> - <tr> - <td>{{HTMLElement("textarea")}}</td> - <td>代表<em>多行文本框</em> 。</td> - </tr> - <tr> - <td>{{HTMLElement("keygen")}} <a href="/zh-CN/docs/HTML/HTML5"><img alt="这个元素在 HTML5 中加入" src="/files/3843/HTML5_Badge_32.png" style="height: 16px; vertical-align: middle; width: 16px;" title="这个元素在 HTML5 中加入"></a></td> - <td>代表一个<em>密钥对生成器</em> 控件。</td> - </tr> - <tr> - <td>{{HTMLElement("output")}} <a href="/zh-CN/docs/HTML/HTML5"><img alt="这个元素在 HTML5 中加入" src="/files/3843/HTML5_Badge_32.png" style="height: 16px; vertical-align: middle; width: 16px;" title="这个元素在 HTML5 中加入"></a></td> - <td>代表<em>计算值</em> 。</td> - </tr> - <tr> - <td>{{HTMLElement("progress")}} <a href="/zh-CN/docs/HTML/HTML5"><img alt="这个元素在 HTML5 中加入" src="/files/3843/HTML5_Badge_32.png" style="height: 16px; vertical-align: middle; width: 16px;" title="这个元素在 HTML5 中加入"></a></td> - <td>代表<em>进度条</em> 。</td> - </tr> - <tr> - <td>{{HTMLElement("meter")}} <a href="/zh-CN/docs/HTML/HTML5"><img alt="这个元素在 HTML5 中加入" src="/files/3843/HTML5_Badge_32.png" style="height: 16px; vertical-align: middle; width: 16px;" title="这个元素在 HTML5 中加入"></a></td> - <td>代表<em>滑动条</em> 。</td> - </tr> - </tbody> -</table> - -<h2 id="交互元素">交互元素</h2> - -<table class="standard-table"> - <thead> - <tr> - <th scope="col">Element</th> - <th scope="col">Description</th> - </tr> - </thead> - <tbody> - <tr> - <td>{{HTMLElement("details")}} <a href="/zh-CN/docs/HTML/HTML5"><img alt="这个元素在 HTML5 中加入" src="/files/3843/HTML5_Badge_32.png" style="height: 16px; vertical-align: middle; width: 16px;" title="这个元素在 HTML5 中加入"></a></td> - <td>代表一个用户可以(点击)获取额外信息或控件的<em>小部件</em> 。</td> - </tr> - <tr> - <td>{{HTMLElement("summary")}} <a href="/zh-CN/docs/HTML/HTML5"><img alt="这个元素在 HTML5 中加入" src="/files/3843/HTML5_Badge_32.png" style="height: 16px; vertical-align: middle; width: 16px;" title="这个元素在 HTML5 中加入"></a></td> - <td>代表 <code><details></code> 元素的<em>综述</em> 或<em>标题</em> 。</td> - </tr> - <tr> - <td>{{HTMLElement("menuitem")}} <a href="/zh-CN/docs/HTML/HTML5"><img alt="这个元素在 HTML5 中加入" src="/files/3843/HTML5_Badge_32.png" style="height: 16px; vertical-align: middle; width: 16px;" title="这个元素在 HTML5 中加入"></a></td> - <td>代表一个用户可以点击的菜单项。</td> - </tr> - <tr> - <td>{{HTMLElement("menu")}} <a href="/zh-CN/docs/HTML/HTML5"><img alt="这个元素在 HTML5 中加入" src="/files/3843/HTML5_Badge_32.png" style="height: 16px; vertical-align: middle; width: 16px;" title="这个元素在 HTML5 中加入"></a></td> - <td>代表菜单。</td> - </tr> - </tbody> -</table> - -<h2 id="另请参阅">另请参阅</h2> - -<ul> - <li><a href="/zh-CN/docs/HTML/HTML5" title="HTML/HTML5">一系列 HTML5 文档</a>。</li> - <li><a href="/zh-CN/docs/HTML/Element" title="HTML/Element">所有 HTML 标签的参考</a>，包括 HTML5 中不再有效的元素。</li> -</ul> diff --git a/files/zh-cn/web/guide/html/html5/html5_thematic_classification/index.html b/files/zh-cn/web/guide/html/html5/html5_thematic_classification/index.html deleted file mode 100644 index 3759db3097..0000000000 --- a/files/zh-cn/web/guide/html/html5/html5_thematic_classification/index.html +++ /dev/null @@ -1,169 +0,0 @@ ---- -title: HTML5 & friends thematic classification -slug: Web/Guide/HTML/HTML5/HTML5_Thematic_Classification -translation_of: Web/Guide/HTML/HTML5 -translation_of_original: Web/Guide/HTML/HTML5/HTML5_Thematic_Classification ---- -<p>这个页面提供了有关HTML5的主题链接，有些链接一般与HTML5关联但实际上并不是HTML标准，为了方便这些内容也被整理到这里。</p> -<h2 id="HTML"><span class="author-g-lqfq0qqpckp8p3co">HTML</span></h2> -<h3 id="Audio_和_video"><span class="author-g-lqfq0qqpckp8p3co">Audio</span><span class="author-g-101xw018h73xu61x"> 和 video</span></h3> -<div class="ace-line"> - Firefox 3.5引入对HTML5<audio>和<video>元素的支持，提供向HTML文档轻松嵌入媒体资源的能力。参考：<span class="author-g-101xw018h73xu61x url"><a href="/en/Using_HTML5_audio_and_video" title="En/Using_audio_and_video_in_Firefox">在 Firefox 中使用audio和video</a></span></div> -<div class="ace-line"> - </div> -<h3 id="Canvas"><span class="author-g-101xw018h73xu61x">Canvas</span></h3> -<p><Canvas>是HTML新元素，可以用于通过脚本（常用 <a href="../../../../en/JavaScript" rel="internal">JavaScript</a>）绘制图像，例如，它可以用来绘制图表，合成照片甚至实现动画。</p> -<p>参考：</p> -<ul> - <li><span class="author-g-101xw018h73xu61x url"><a href="/en/HTML/Canvas" title="en/HTML/Canvas">Canvas</a></span> 元素</li> - <li><a href="/en/Canvas_tutorial" title="en/Canvas tutorial">Canvas 教程</a></li> -</ul> -<h3 id="WebGL_(独立规范)"><span class="author-g-101xw018h73xu61x">WebGL </span>(独立规范)</h3> -<div class="ace-line"> - webGL WebGL brings 3D graphics to the Web by introducing an API that closely conforms to OpenGL ES 2.0 and can be used in HTML5 {{ HTMLElement("canvas") }} elements.</div> -<div class="ace-line" id="magicdomid483"> - <span class="author-g-101xw018h73xu61x">Reference: </span><span class="author-g-101xw018h73xu61x url"><a href="/en/WebGL" title="en/WebGL">WebGL</a></span></div> -<h3 id="Inline_SVG_and_MathML"><span class="author-g-101xw018h73xu61x">Inline SVG and MathML</span></h3> -<div class="ace-line"> - HTML5 parsing liberates MathML and SVG from XML and makes them available in the main file format of the Web.</div> -<div class="ace-line" id="magicdomid543"> - <span class="author-g-101xw018h73xu61x">Reference: </span></div> -<ul> - <li><span class="author-g-101xw018h73xu61x url"><a href="/en/SVG" title="en/SVG">SVG</a></span></li> - <li><a href="/en/MathML" title="en/MathML">MathML</a></li> -</ul> -<h3 id="New_link_relations"><span class="author-g-101xw018h73xu61x">New link relations</span></h3> -<div class="ace-line" id="magicdomid407"> - Link relations complement the <a> tag and specify why you're pointing to another page.</div> -<div class="ace-line"> - Reference:</div> -<h3 id="Web_forms"><span class="author-g-101xw018h73xu61x">Web forms</span></h3> -<div class="ace-line"> - Form elements and attributes in HTML5 provide a greater degree of semantic mark-up than HTML4 and remove a great deal of the need for tedious scripting and styling that was required in HTML4.</div> -<div class="ace-line" id="magicdomid169"> - <span class="author-g-101xw018h73xu61x">Reference:</span></div> -<ul> - <li><span class="author-g-101xw018h73xu61x url"><a href="/en/HTML/Forms_in_HTML" title="en/HTML/HTML5/Forms_in_HTML5">Forms in HTML5</a></span></li> - <li><span class="author-g-101xw018h73xu61x url"><a href="/en/Using_files_from_web_applications" title="en/Using_files_from_web_applications">Using files from web applications</a></span></li> -</ul> -<h3 id="Microformats_(separate_specification)"><span class="author-g-101xw018h73xu61x">Microformats (separate specification)</span></h3> -<div class="ace-line" id="magicdomid448"> - Microformats allow web sites to provide semantic data to the browser in order to make it possible to present summaries of the information on a page without having to know how to parse the document itself.</div> -<div class="ace-line"> - Reference: <span class="author-g-101xw018h73xu61x url"><a href="/en/Using_microformats" title="en/Using_microformats">Using microformats</a></span></div> -<div class="ace-line"> - See also: <a class="external" href="http://www.microformats.org" title="http://www.microformats.org">http://www.microformats.org</a></div> -<h3 id="Semantic_tags"><span class="author-g-101xw018h73xu61x">Semantic tags</span></h3> -<div class="ace-line"> - The HTML5 specification brings several new elements to web developers allowing them to describe the structure of a web document with a standard semantics.</div> -<div class="ace-line"> - Reference:</div> -<ul> - <li><a href="/en/Sections_and_Outlines_of_an_HTML5_document" title="en/Sections and Outlines of an HTML5 document">Sections and Outlines of an HTML5 document</a></li> - <li>{{ HTMLElement("article") }}</li> - <li>{{ HTMLElement("aside") }}</li> - <li>{{ HTMLElement("figcaption") }}</li> - <li>{{ HTMLElement("figure") }}</li> - <li>{{ HTMLElement("footer") }}</li> - <li>{{ HTMLElement("header") }}</li> - <li>{{ HTMLElement("mark") }}</li> - <li>{{ HTMLElement("nav") }}</li> - <li>{{ HTMLElement("section") }}</li> - <li>{{ HTMLElement("time") }}</li> -</ul> -<h2 id="JavaScript_(separate_specifications)"><span class="author-g-lqfq0qqpckp8p3co">JavaScript </span>(separate specifications)</h2> -<h3 id="Client-Side_Storage"><span class="author-g-101xw018h73xu61x">Client-Side Storage</span></h3> -<div class="ace-line"> - Firefox supports the HTML 5 specification for offline caching of web applications' resources and offline storage of data.</div> -<div class="ace-line"> - Reference:</div> -<ul> - <li><span class="author-g-101xw018h73xu61x url"><a href="/en/Using_the_Application_Cache" title="en/Using_the_Application_Cache">Offline resources in Firefox</a></span></li> - <li><span class="author-g-101xw018h73xu61x url"><a href="/en/DOM/Storage" title="en/DOM/Storage">DOM Storage</a></span></li> -</ul> -<h3 id="IndexedDB"><span class="author-g-101xw018h73xu61x">IndexedDB</span></h3> -<div class="ace-line" id="magicdomid361"> - <a class="external" href="http://dev.w3.org/2006/webapi/IndexedDB/">IndexedDB</a> is an evolving web standard for the storage of significant amounts of structured data in the browser and for high performance searches on this data using indexes.</div> -<div class="ace-line"> - Reference: <a href="/en/IndexedDB" title="en/IndexedDB">IndexedDB</a></div> -<h3 id="Web_workers_(separate_specification)"><span class="author-g-101xw018h73xu61x">Web workers </span><span class="author-g-101xw018h73xu61x">(separate specification)</span></h3> -<div class="ace-line"> - Workers provide a simple means for web content to run scripts in background threads. Once created, a worker can send messages to the spawning task by posting messages to an event handler specified by the creator.</div> -<div class="ace-line" id="magicdomid143"> - <span class="author-g-101xw018h73xu61x">Reference: </span><span class="author-g-101xw018h73xu61x url"><a href="/En/DOM/Using_web_workers" title="En/Using_web_workers">Using web workers</a></span></div> -<h3 id="New_events"><span class="author-g-101xw018h73xu61x">New events</span></h3> -<div class="ace-line"> - In order to build a good offline-capable web application, you need to know when your application is actually offline. Incidentally, you also need to know when your application has returned to an online status again.</div> -<div class="ace-line" id="magicdomid161"> - <span class="author-g-101xw018h73xu61x">Reference: </span><span class="author-g-101xw018h73xu61x url"><a href="/en/Online_and_offline_events" title="en/Online_and_offline_events">Online and offline events</a></span></div> -<h3 id="Drag_and_drop"><span class="author-g-101xw018h73xu61x">Drag and drop</span></h3> -<div class="ace-line"> - Firefox and other Mozilla applications support a number of features for handling drag and drop. This allows you the user to click and hold the mouse button down over an element, drag it to another location, and release the mouse button to drop the element there.</div> -<div class="ace-line"> - Reference: <span class="author-g-101xw018h73xu61x url"><a href="/En/DragDrop/Drag_and_Drop" title="En/DragDrop/Drag_and_Drop">Drag and Drop</a></span></div> -<h3 id="Protocol_handler"><span class="author-g-101xw018h73xu61x">Protocol handler</span></h3> -<div class="ace-line"> - <p>It's fairly common to find web pages link to resources using non-<code>http</code> protocols. You can think of this as a <em>desktop-based</em> protocol handler.</p> - <p>Reference: <span class="author-g-101xw018h73xu61x url"><a href="/en/Web-based_protocol_handlers" title="en/Web-based_protocol_handlers">Web-based protocol handler</a></span></p> - <h3 id="Geolocation">Geolocation</h3> -</div> -<div class="ace-line"> - The Geolocation API allows the user to provide their location to web applications if they so desire. For privacy reasons, the user is asked to confirm permission to report location information.</div> -<div class="ace-line" id="magicdomid294"> - <span class="author-g-101xw018h73xu61x">Reference: </span><span class="author-g-101xw018h73xu61x url"><a href="/En/Using_geolocation" title="En/Using_geolocation">Using geolocation</a></span></div> -<div class="ace-line"> - <span class="author-g-101xw018h73xu61x url">See also: <a class="external" href="http://dev.w3.org/geo/api/spec-source.html" title="Geolocation Spec">Geolocation Specification</a></span></div> -<div class="ace-line"> - <h3 id="Focus_attributes"><span class="author-g-101xw018h73xu61x">Focus attributes</span></h3> - <div class="ace-line"> - The focus atributes let a script understand if an element has the focus of the user and then act accordingly.</div> - <div class="ace-line" id="magicdomid231"> - <span class="author-g-101xw018h73xu61x">Reference: </span><span class="author-g-101xw018h73xu61x url"><a href="/en/Focus_management_in_HTML" title="en/Focus_management_in_HTML">Focus management in HTML</a></span></div> - <span class="author-g-101xw018h73xu61x"> </span></div> -<h2 id="CSS_(separate_specifications)"><span class="author-g-lqfq0qqpckp8p3co">CSS</span> (separate specifications)</h2> -<h3 id="New_CSS_selectors"><span class="author-g-101xw018h73xu61x">New CSS selectors</span></h3> -<div class="ace-line"> - The following page shows the CSS3 support in Firefox and the new elements for HTML5.</div> -<div class="ace-line" id="magicdomid759"> - <span class="author-g-101xw018h73xu61x">Ref</span><span class="author-g-101xw018h73xu61x">erence: </span><span class="author-g-101xw018h73xu61x url"><a href="/en/Mozilla_CSS_support_chart" title="en/Mozilla_CSS_support_chart">Mozilla CSS support chart</a></span></div> -<h3 id="Typography">Typography</h3> -<p>The following pages show some of the typography attributes introduced by CSS3.</p> -<div class="ace-line"> - Text wrap:</div> -<ul> - <li><span class="author-g-101xw018h73xu61x url"><a href="/En/CSS/Word-wrap" title="en/CSS/word-wrap">Word-wrap</a></span></li> - <li><span class="author-g-101xw018h73xu61x url"><a href="/en/CSS/text-overflow" title="en/CSS/text-overflow">Text-overflow</a></span></li> - <li><a href="/en/CSS/@font-face" title="En/CSS/@font-face"><span class="author-g-101xw018h73xu61x url">@font-face</span></a></li> -</ul> -<h3 id="Layout"><span class="author-g-101xw018h73xu61x url">Layout</span></h3> -<div class="ace-line" id="magicdomid656"> - <span class="author-g-101xw018h73xu61x">Columns:</span></div> -<ul> - <li><span class="author-g-101xw018h73xu61x url"><a href="/en/CSS/Using_CSS_multi-column_layouts" title="en/CSS/CSS3_Columns">CSS3 Multi-columns</a></span></li> - <li><a href="/en/Using_flexbox" title="en/Using_flexbox">Flexbox</a></li> -</ul> -<h3 id="Visual">Visual</h3> -<div class="ace-line"> - The following pages show some of the visual attributes introduced by CSS3.</div> -<ul> - <li><span class="author-g-101xw018h73xu61x">Opacity:</span> <span class="author-g-101xw018h73xu61x url"><a href="/en/CSS/opacity" title="en/CSS/opacity">opacity</a></span></li> - <li><span class="author-g-101xw018h73xu61x">Hue Saturation Color:</span> <span class="author-g-101xw018h73xu61x url"><a href="/en/CSS/color" title="en/CSS/color">color</a></span></li> - <li><span class="author-g-101xw018h73xu61x">Rounded Corners:</span> <a href="/en/CSS/border-radius" title="En/CSS/Border-radius">border-radius</a></li> - <li><span class="author-g-101xw018h73xu61x">Gradients:</span> <span class="author-g-101xw018h73xu61x url"><a href="/en/CSS/Using_CSS_gradients" title="en/Using_gradients">Using gradients</a></span></li> - <li><span class="author-g-101xw018h73xu61x">Shadows:</span> - <ul> - <li><span class="author-g-101xw018h73xu61x url"><a href="/en/CSS/text-shadow" title="en/CSS/text-shadow">text-shadow</a></span></li> - <li><span class="author-g-101xw018h73xu61x url"><a href="/En/CSS/Box-shadow" title="En/CSS/Box-shadow">box-shadow</a></span></li> - </ul> - </li> - <li><span class="author-g-101xw018h73xu61x">Background:</span> <span class="author-g-101xw018h73xu61x url"><a href="/en/CSS/background" title="en/CSS/background">background</a></span></li> -</ul> -<h3 id="Dynamic_effects">Dynamic effects</h3> -<div class="ace-line"> - CSS also introduces dynamic effects:</div> -<ul> - <li><span class="author-g-101xw018h73xu61x">Transitions:</span> <span class="author-g-101xw018h73xu61x url"><a href="/en/CSS/CSS_transitions" title="en/CSS/CSS_transitions">CSS transitions</a></span></li> - <li><span class="author-g-101xw018h73xu61x">Animations:</span> <a href="/en/CSS/CSS_animations" title="en/CSS/CSS_animations">CSS animations</a></li> - <li><span class="author-g-101xw018h73xu61x">Transforms:</span> <span class="author-g-101xw018h73xu61x url"><a href="/En/CSS/Using_CSS_transforms" title="En/CSS/Using_CSS_transforms">Using CSS transforms</a></span></li> -</ul> -<p>{{ languages( { "ja": "ja/HTML/HTML5/HTML5_Thematic_Classification"} ) }}</p> diff --git a/files/zh-cn/web/guide/html/html5/index.html b/files/zh-cn/web/guide/html/html5/index.html index cf907d36d7..34bd9fb118 100644 --- a/files/zh-cn/web/guide/html/html5/index.html +++ b/files/zh-cn/web/guide/html/html5/index.html @@ -182,5 +182,5 @@ translation_of: Web/Guide/HTML/HTML5 <p>被废弃的重复链接：https://developer.mozilla.org/zh-CN/docs/HTML5_junk</p> <p> - <audio style="display: none;"> </audio> + <audio class="hidden"> </audio> </p> |