Rumah >hujung hadapan web >html tutorial >html标签分类

html标签分类

不言asal: 2018-04-28 16:44:192591semak imbas

将 HTML 元素按功能进行分组。先简单会汇总下，熟悉的放前面。

根元素:<html> 文档元数据:<link>、<meta>、<style>、<style>
内容分区:<header>、<nav>、 <section>、<aside> 、<footer> 、<h1>~<h6> 、<article> 、<address>、<hgroup> 
文本内容:<main>、<p>、<p>、<pre class="brush:php;toolbar:false">、<ol>、 <ul>、<li>、<dl> 、<dt>、<dd>、<figure> 、<figcaption>、<blockquote> 、<hr>
内联文本语义:<span>、<a>、<strong>、<em>、<q>、<br>、<mark>、<code>、<abbr>、<b>、<bdi>、<bdo>、<sub>、<sup>、<time>、<i>、<u>、<cite>、<data>、<kbd>、<nobr>、<s>、<samp>、<tt>、<var>、<wbr>、<rp>、<rt>、<rtc>、<ruby>
图片和多媒体:<img><audio> <video><track><map><area>
内嵌内容:<iframe>、<embed>、<object> 、<param>、<picture>、<source>
脚本:<canvas>、<noscript>、<script>
编辑标识:<del>、<ins> 
表格内容:<table>、<caption>、<thead>、<tbody>、<tfoot>、<tr>、、<col><colgroup>、<th>、<td>
表单:<form> 、<input>、<textarea> 、<label>、<button>、<datalist>、<fieldset>、<legend>、<meter>、<optgroup>、<option>、<output>、<progress>、<select>
交互元素<details>、<summary>、<dialog>、<menu>Web 组件:<slot>、<template>
过时的和弃用的元素:<acronym><applet><basefont><bgsound><big><blink><center><command><content><dir><element><font><frame><frameset><image><isindex><keygen><listing><marquee><menuitem><multicol><nextid><nobr><noembed><noframes><plaintext><spacer><strike><shadow><tt><xmp>

1. 根元素

<html>  HTML文档的根

2. 文档元数据

元数据（Metadata）含有页面的相关信息，包括样式、脚本及数据，能帮助一些软件 (如搜索引擎，浏览器等等）更好地运用和渲染页面。对于样式和脚本的元数据，可以直接在网页里定义，也可以链接到包含相关信息的外部文件。

<link> 链接<meta> 元数据信息，(<base>, <link>, <script>, <style> 或 <title>不能表示的元数据信息) 
<style> 样式信息
<style> 文档标题

3. 内容分区

内容分区元素允许你将文档内容从逻辑上进行组织划分。使用包括页眉(header)、页脚(footer)、导航(nav)和标题(h1~h6)等分区元素，来为页面内容创建明确的大纲，以便区分各个章节的内容。

<header> 表示一组引导性的帮助
<nav>  导航
<section> 表示文档中的一个区域（或节），通过是否含一个标题作为子节点来辨识<section>
<aside> 表示与其余页面无关的内容部分
<footer> 表示最近一个章节内容或者根节点元素的页脚<h1>~<h6> 标题
<article> 表示文档、页面、应用或网站中的独立结构
<address> 地址信息
<hgroup> 代表一个段的标题

4. 文本内容

使用 HTML 文本内容元素来组织在开标签和闭标签里的块或章节的内容。这些元素能标识内容的宗旨或结构，而这对于 accessibility 和 SEO 很重要。

<main> 文档<body>或应用的主体部分
<div> 文档分区元素， 通用型流内容容器
<p> 段落
<pre class="brush:php;toolbar:false"> 预定义格式文本
<ol> 有序列表
<ul> 无序列表
<li> 列表条目元素
<dl> 描述列表元素
<dt>术语定义元素
<dd> 描述元素，描述列表  (<dl>) 的子元素，<dd>与 <dt> 一起用。
<figure> 代表一段独立的内容, 经常与说明(caption) 
<figcaption> 配合使用<figcaption>图片说明/标题，于描述其父节点 
<figure> 元素里的其他数据
<blockquote> HTML 块级引用元素<hr>表示段落级元素之间的主题转换，视觉上看是水平线

5. 内联文本语义

使用 HTML 内联文本语义(Inline text semantics)定义语句，结构，可以是一个词，一段，或任意风格的文字。

<kbd> 表示用户输入
<span> 通用行内容器
<a> 超链接
<strong> 粗体显示
<em> 标记出需要用户着重阅读的内容，可通过嵌套加深着重程度
<q> 短的引用文本
<br> 换行
<mark> 代表突出显示的文字，可以用来显示搜索引擎搜索后关键词。
<code> 呈现一段计算机代码
<abbr> 缩写，并可选择提供一个完整的描述
<b>提醒注意，样式和粗体类似（不要用于显示粗体，用css font-weight来创建粗体）
<bdi> 双向隔离元素
<bdo> 双向覆盖元素
<sub> 排低文本
<sup> 排高文本
<time> 时间
<i> 区分普通文本的一系列文本，内容通常以斜体显示
<u> 使文本在其内容的基线下的一行呈现下划线
<cite> 表示一个作品的引用
<data> 将一个指定内容和机器可读的翻译联系在一起。但如果内容是与 time 或者 date 相关的，一定要使用 <time>。
<dfn> 表示术语的一个定义
<kbd> 表示用户输入
<nobr> 阻止文本自动拆分成新行，不应该使用，应该使用css属性
<s> 删除线，提倡使用 <del> 和 <ins> 元素
<samp> 标识计算机程序输出
<tt> 电报文本元素
<var> 表示变量的名称，或者由用户提供的值
<wbr> 一个文本中的位置，其中浏览器可以选择来换行<rp><rt><rtc><ruby>

6. 图片和多媒体

HTML 支持各种多媒体资源，例如图像，音频和视频。
<img> 图片
<audio> 音频内容
<video> 视频内容
<track> 被当作媒体元素—
<audio> 和 <video>的子元素来使用。它允许指定计时字幕（或者基于事件的数据），例如自动处理字幕。
<map> 与 <area> 属性一起使用来定义一个图像映射(一个可点击的链接区域).
<area> 在图片上定义一个热点区域，可以关联一个超链接。
<area>元素仅在<map>元素内部使用。

7. 内嵌内容

除了常规的多媒体内容，HTML 可以包括各种其他的内容，即使它并不容易交互。

<iframe> 表示嵌套的浏览上下文，有效地将另一个HTML页面嵌入到当前页面中。
<embed> 将外部内容嵌入文档中的指定位置
<object> 表示引入一个外部资源
<param>  定义了 <object>的参数<picture> 容器，用来为其内部特定的 <img> 元素提供多样的 <source> 元素。<source> 资源

8. 脚本

为了创建动态内容和 Web 应用程序，HTML 支持使用脚本语言，最突出的就是 JavaScript。某些元素支持此功能。

<canvas> 通过脚本（通常是JavaScript）绘制图形<noscript> 替代未执行脚本<script> 用于嵌入或引用可执行脚本

9. 编辑标识

这些元素能标示出某个文本被更改过的部分。

<del>  表示一些被从文档中删除的文字内容<ins>  定义已经被插入文档中的文本

10. 表格内容

这里的元素用于创建和处理表格数据。元素在一个元素中可以出现一个或者更多。

<table> 表格
<caption> 表格的标题，通常作为 <table> 的第一个子元素出现
<thead> 表格页眉
<tbody> 表格主体
<tfoot> 表格页脚<tr> 行<col> 列， 通常位于<colgroup>元素内
<colgroup> 表格列组
<th> 表头<td> 表格单元

11. 表单

HTML 提供了许多可一起使用的元素，这些元素能用来创建一个用户可以填写并提交到网站或应用程序的表单。

<form> 表单
<input> 输入域
<textarea> 多行文本域
<label> 标题
<button> 按钮
<datalist> 包含了一组<option>元素,这些元素表示其它表单控件可选值<fieldset> 一组相关的表单元素，并使用外框包含起<legend> 表示它的父元素<fieldset>的内容的标题
<meter> 显示已知范围的标量值或者分数值
<optgroup> 一个 <select> 元素中的一组选项
<option>  用于定义在<select>,  <optgroup> 或<datalist> 元素中包含的项
<output> 表示计算或用户操作的结果
<progress> 进度条
<select> 选项菜单

12. 交互元素

HTML 提供了一系列有助于创建交互式用户界面对象的元素。

<details><summary> 用作 一个<details>元素的一个内容的摘要，标题或图例。<dialog> 对话框<menu> 菜单

13. Web 组件

Web 组件是种近似 HTML（HTML-related）的技术，这使得它能够，从本质上讲，创建和使用自定义元素，就好像它是普通的 HTML。此外，你甚至可以创建自定义版本的标准 HTML 元素。（注意：规范还没有确定）

<slot> web组件技术的一部分，slot是web组件的一个占位符<template> 用于保存客户端内容的机制

14. 过时的和弃用的元素

<acronym><applet><basefont><bgsound><big><blink><center><command><content><dir><element><font><frame><frameset><image><isindex><keygen><listing><marquee><menuitem><multicol><nextid><nobr><noembed><noframes><plaintext><spacer><strike><shadow><tt><xmp>

15. 参考链接

https://developer.mozilla.org/zh-CN/docs/Web/HTML/Element
php中文网在线手册 http://www.php.cn/course/27.html

Atas ialah kandungan terperinci html标签分类. Untuk maklumat lanjut, sila ikut artikel berkaitan lain di laman web China PHP!

php JavaScript html 对象 http https 搜索引擎 SEO

Kenyataan：

Kandungan artikel ini disumbangkan secara sukarela oleh netizen, dan hak cipta adalah milik pengarang asal. Laman web ini tidak memikul tanggungjawab undang-undang yang sepadan. Jika anda menemui sebarang kandungan yang disyaki plagiarisme atau pelanggaran, sila hubungi admin@php.cn

Artikel sebelumnya：html中隐藏域hidden的作用介绍及使用示例Artikel seterusnya：HTML基础之选择器

Artikel berkaitan

Lihat lagi