2.HTML5常用元素参考一览表
目录
句法:
元素=开始标签+元素内容+结束标签+标签属性


这个元素的主要部分有:
- 开始标签(Opening tag):包含元素的名称(本例为 p),被大于号、小于号所包围。表示元素从这里开始或者开始起作用 —— 在本例中即段落由此开始。
- 结束标签(Closing tag):与开始标签相似,只是其在元素名之前包含了一个斜杠。这表示着元素的结尾 —— 在本例中即段落在此结束。初学者常常会犯忘记包含结束标签的错误,这可能会产生一些奇怪的结果。
- 内容(Content):元素的内容,本例中就是所输入的文本本身。
- 元素(Element):开始标签、结束标签与内容相结合,便是一个完整的元素。
元素也可以有属性(Attribute):
属性包含了关于元素的一些额外信息,这些信息本身不应显现在内容中。本例中,class
是属性名称,editor-note
是属性的值 。class
属性可为元素提供一个标识名称,以便进一步为元素指定样式或进行其他操作时使用。
属性应该包含:
- 在属性与元素名称(或上一个属性,如果有超过一个属性的话)之间的空格符。
- 属性的名称,并接上一个等号。
- 由引号所包围的属性值。
例子:
#Bootstrap示范模板
<!doctype html>
<html lang="en">
<head>
<!-- Required meta tags -->
<meta charset="utf-8">
<meta name="viewport" content="width=device-width, initial-scale=1, shrink-to-fit=no">
<!-- Bootstrap CSS -->
<link rel="stylesheet" href="https://stackpath.bootstrapcdn.com/bootstrap/4.5.2/css/bootstrap.min.css" integrity="sha384-JcKb8q3iqJ61gNV9KGb8thSsNjpSL0n8PARn9HuZOnIxN0hoP+VmmDGMN5t9UJ0Z" crossorigin="anonymous">
<title>Hello, world!</title>
</head>
<body>
<h1>Hello, world!</h1>
<!-- Optional JavaScript -->
<!-- jQuery first, then Popper.js, then Bootstrap JS -->
<script src="https://code.jquery.com/jquery-3.5.1.slim.min.js" integrity="sha384-DfXdz2htPH0lsSSs5nCTpuj/zy4C+OGpamoFVy38MVBnE+IbbVYUew+OrCXaRkfj" crossorigin="anonymous"></script>
<script src="https://cdn.jsdelivr.net/npm/popper.js@1.16.1/dist/umd/popper.min.js" integrity="sha384-9/reFTGAW83EW2RDu2S0VKaIzap3H66lZH81PoYlFhbGU+6BZp6G7niu735Sk7lN" crossorigin="anonymous"></script>
<script src="https://stackpath.bootstrapcdn.com/bootstrap/4.5.2/js/bootstrap.min.js" integrity="sha384-B4gt1jrGC7Jh4AgTPSdUtOBvfO8shuf57BaghqFfPlYxofvL8/KUEfYiJOMMV+rV" crossorigin="anonymous"></script>
</body>
</html>
1.基础
<!DOCTYPE> 定义文档类型。
<html> 标示HTML文档的根。
<body> 定义文档的主体。
<h1> to <h6> 定义 HTML 标题。
<p> 定义段落。
<br> 定义简单的折行。
<hr> 定义水平线。
<!--...--> 定义注释。
2.头部
<head> 表示 Document 的元数据集合。
<meta> 定义关于 HTML 文档的元信息。
<title> 标签定义文档的标题。
<link> 定义文档与外部资源的关系。
<script> 定义客户端脚本。
<noscript> 为不支持客户端脚本的浏览器定义替代内容。
<style> 用于为 HTML 文档定义样式信息。
<base> 定义页面中所有链接的默认地址或默认目标。
<basefont> 已废弃。定义页面中文本的默认字体、颜色或尺寸。
#头部元信息示例
<!DOCTYPE HTML>
<HTML LANG="EN">
<HEAD>
<META CHARSET="UTF-8">
<BASE HREF="https://www.example.com/">
<TITLE>An application with a long head</TITLE>
<LINK REL="STYLESHEET" HREF="default.css">
<LINK REL="STYLESHEET ALTERNATE" HREF="big.css" TITLE="Big Text">
<SCRIPT SRC="support.js"></SCRIPT>
<META NAME="APPLICATION-NAME" CONTENT="Long headed application">
</HEAD>
<BODY>
...
3.布局
<style> 定义文档的样式信息。
<div> 定义文档中的节。
<span> 定义文档中的节。
<header> 定义 section 或 page 的页眉。
<nav> 定义导航链接的容器。
<section> 定义 section。
<article> 定义文章。
<aside> 定义页面内容之外的内容。
<footer> 定义 section 或 page 的页脚。
<details> 定义元素的细节。
<dialog> 定义对话框或窗口。
<summary> 为 <details> 元素定义可见的标题。
<hgroup> 定义一个段的标题。
4.文本
<a> 定义锚。
<background-color> 定义背景颜色
<background> 已废弃。定义背景图像
<font-family> 定义字体
<font-size> 定义字号
<text-align> 定义文本对齐方式
<b> 定义粗体文本。
<bdi> 定义文本的文本方向,使其脱离其周围文本的方向设置。
<big> 已废弃。定义大号文本。
<center> 已废弃。定义居中文本。
<color> 已废弃。定义颜色。
<del> 定义被删除文本。
<em> 定义强调文本。
<font> 已废弃。定义文本的字体、尺寸和颜色
<i> 定义斜体文本。
<ins> 定义被插入文本。
<main> 定义文档的主内容。
<mark> 定义有记号的文本。
<meter> 定义预定义范围内的度量。
<progress> 定义任何类型的任务的进度。
<rp> 定义若浏览器不支持 ruby 元素显示的内容。
<rt> 定义 ruby 注释的解释。
<ruby> 定义 ruby 注释。
<s> 已废弃。定义加删除线的文本。
<small> 定义小号文本。
<strike> 已废弃。定义加删除线文本。
<strong> 定义语气更为强烈的强调文本。
<sup> 定义上标文本。
<sub> 定义下标文本。
<time> 定义日期/时间。
<tt> 定义打字机文本。
<u> 已废弃。定义下划线文本。
<wbr> 定义可能的换行符。
5.引用
<abbr> 定义缩写。
<acronym> 已废弃。定义只取首字母的缩写。
<address> 定义文档作者或拥有者的联系信息。
<bdo> 定义文字方向。
<blockquote> 定义长的引用。
<q> 定义短的引用语。
<cite> 定义引用、引证。
<dfn> 定义一个定义项目。
6.图像
<img> 定义图像。
<map> 定义图像地图。
<area> 定义图像地图内部的区域。
<canvas> 定义图形。最适合图像密集型的游戏,其中的许多对象会被频繁重绘。
<svg> 定义矢量图形。最适合带有大型渲染区域的应用程序,复杂度高会减慢渲染速度。
<figcaption> 定义 figure 元素的标题。
<figure> 定义媒介内容的分组,以及它们的标题。
7.音频/视频
<audio> 定义声音内容。
<source> 定义媒介源。
<track> 定义用在媒体播放器中的文本轨道。
<video> 定义视频。
8.列表
<ul> 定义无序列表。
<ol> 定义有序列表。
<li> 定义列表的项目。
<dir> 已废弃。定义目录列表。
<dl> 定义定义列表。
<dt> 定义定义列表中的项目。
<dd> 定义定义列表中项目的描述。
<menu> 已废弃。定义命令的菜单/列表。
<menuitem> 定义用户可以从弹出菜单调用的命令/菜单项目。
<command> 已废弃。定义命令按钮。
9.表格
<table> 定义表格
<caption> 定义表格标题。
<th> 定义表格中的表头单元格。
<tr> 定义表格中的行。
<td> 定义表格中的单元。
<thead> 定义表格中的表头内容。
<tbody> 定义表格中的主体内容。
<tfoot> 定义表格中的表注内容(脚注)。
<col> 定义表格中一个或多个列的属性值。
<colgroup> 定义表格中供格式化的列组。
10.表单
<form> 定义供用户输入的 HTML 表单。
<input> 定义输入控件。
<textarea> 定义多行的文本输入控件。
<label> 定义 input 元素的标注。
<button> 定义按钮。
<select> 定义选择列表(下拉列表)。
<option> 定义选择列表中的选项。
<optgroup> 定义选择列表中相关选项的组合。
<fieldset> 定义围绕表单中元素的边框。
<legend> 定义 fieldset 元素的标题。
<isindex> 已废弃。定义与文档相关的可搜索索引。
<data> 将一个指定内容和机器可读的翻译联系在一起。但是,如果内容是与时间或者日期相关的,则一定要使用 <time>。
<datalist> 定义下拉列表。
<keygen> 已废弃。定义生成密钥。
<output> 定义输出的一些类型。
11.框架
<frame> 已废弃。定义框架集的窗口或框架。
<frameset> 已废弃。定义框架集。
<noframes> 已废弃。定义针对不支持框架的用户的替代内容。
<iframe> 定义内联框架。
12.编程
<script> 定义客户端脚本。
<noscript> 定义针对不支持客户端脚本的用户的替代内容。
<applet> 已废弃。定义嵌入的 applet。
<embed> 为外部应用程序(非 HTML)定义容器。
<object> 定义嵌入的对象。
<param> 定义对象的参数。
<code> 定义计算机代码。
<kbd> 定义键盘码。
<samp> 定义计算机代码样本。
<tt> 已废弃。定义打字机代码。
<var> 定义变量。
<pre> 定义预格式文本。
<listing> 已废弃。使用 <pre> 代替。
<plaintext> 已废弃。使用 <pre> 代替。
<xmp> 已废弃。使用 <pre> 代替。
13.实体
显示结果 | 描述 | 实体名称 | 实体编号 |
---|---|---|---|
空格 | |   | |
< | 小于号 | < | < |
> | 大于号 | > | > |
& | 和号 | & | & |
“ | 引号 | " | " |
‘ | 撇号 | ' (IE不支持) | ' |
¢ | 分(cent) | ¢ | ¢ |
£ | 镑(pound) | £ | £ |
¥ | 元(yen) | ¥ | ¥ |
€ | 欧元(euro) | € | € |
§ | 小节 | § | § |
© | 版权(copyright) | © | © |
® | 注册商标 | ® | ® |
™ | 商标 | ™ | ™ |
× | 乘号 | × | × |
÷ | 除号 | ÷ | ÷ |
备注:HTML 元素对大小写不敏感
原创文章,作者:huoxiaoqiang,如若转载,请注明出处:https://www.huoxiaoqiang.com/basic/js/1913.html