Maison > interface Web > tutoriel HTML > classification des balises HTML

classification des balises HTML

不言
Libérer: 2018-04-28 16:44:19
original
2594 Les gens l'ont consulté

Regroupez les éléments HTML par fonction. Résumons-le brièvement d’abord, et mettons en premier les plus familiers.

根元素:<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>
Copier après la connexion

1. Élément racine

<html>  HTML文档的根
Copier après la connexion

2. Métadonnées du document

Les métadonnées contiennent des informations relatives à la page, notamment le style, les scripts et les données, qui peuvent aider. certains logiciels (tels que les moteurs de recherche, les navigateurs, etc.) utilisent et affichent mieux les pages. Les métadonnées des styles et des scripts peuvent être définies directement dans la page Web ou liées à des fichiers externes contenant des informations pertinentes.

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

3. Partition de contenu

L'élément de partition de contenu vous permet d'organiser logiquement le contenu du document. Utilisez des éléments de partitionnement, notamment l'en-tête, le pied de page, la navigation et le titre (h1 ~ h6), pour créer un aperçu clair du contenu de la page afin de distinguer le contenu de chaque chapitre.

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

4. Contenu texte

Utilisez des éléments de contenu texte HTML pour organiser le contenu des blocs ou des sections en balises d'ouverture et de fermeture. Ces éléments identifient le but ou la structure du contenu, ce qui est important pour l'accessibilité et le référencement.

<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>表示段落级元素之间的主题转换,视觉上看是水平线
Copier après la connexion

5. Sémantique du texte en ligne

Utilisez la sémantique du texte en ligne HTML (Sémantique du texte en ligne) pour définir des instructions et des structures, qui peuvent être un mot, un paragraphe ou n'importe quel style de texte. .

<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>
Copier après la connexion

6. Images et multimédia

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

7. Contenu intégré

En plus du contenu multimédia classique, le HTML peut inclure une variété d'autres contenus, même si ce n'est pas facile d'interagir avec.

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

8. Scripts

Pour créer du contenu dynamique et des applications Web, HTML prend en charge l'utilisation de langages de script, le plus important étant JavaScript. Certains éléments prennent en charge cette fonctionnalité.

<canvas> 通过脚本(通常是JavaScript)绘制图形<noscript> 替代未执行脚本<script> 用于嵌入或引用可执行脚本
Copier après la connexion

9. Modifier les balises

Ces éléments peuvent marquer la partie modifiée d'un certain texte.

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

10. Contenu du tableau

Les éléments ici sont utilisés pour créer et traiter les données du tableau. Un ou plusieurs éléments peuvent apparaître dans un élément.

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

11. Formulaires

HTML fournit un certain nombre d'éléments qui peuvent être utilisés ensemble pour créer un formulaire que les utilisateurs peuvent remplir et soumettre à un site Web ou à une application.

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

12. Éléments interactifs

HTML fournit une série d'éléments qui aident à créer des objets d'interface utilisateur interactifs.

<details><summary> 用作 一个<details>元素的一个内容的摘要,标题或图例。<dialog> 对话框<menu> 菜单
Copier après la connexion

13. Composants Web

Les composants Web sont une technologie liée au HTML qui permet, essentiellement, la création et l'utilisation d'éléments personnalisés, c'est comme si c'était du HTML normal. De plus, vous pouvez même créer des versions personnalisées d'éléments HTML standard. (Remarque : la spécification n'a pas encore été finalisée)

<slot> web组件技术的一部分,slot是web组件的一个占位符<template> 用于保存客户端内容的机制
Copier après la connexion

14 Éléments obsolètes et obsolètes

<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>
Copier après la connexion

15. >https://developer.mozilla.org/zh-CN/docs/Web/HTML/Element

  • php Manuel en ligne du site Web chinois http://www.php.cn/course /27.html

Ce qui précède est le contenu détaillé de. pour plus d'informations, suivez d'autres articles connexes sur le site Web de PHP en chinois!

Étiquettes associées:
source:php.cn
Déclaration de ce site Web
Le contenu de cet article est volontairement contribué par les internautes et les droits d'auteur appartiennent à l'auteur original. Ce site n'assume aucune responsabilité légale correspondante. Si vous trouvez un contenu suspecté de plagiat ou de contrefaçon, veuillez contacter admin@php.cn
Tutoriels populaires
Plus>
Derniers téléchargements
Plus>
effets Web
Code source du site Web
Matériel du site Web
Modèle frontal