HTML中常用标签--详解
目录
1.b/strong标签
2.i/em 标签
3.u标签
4.del删除线
5.br换行
6.p标签 *
7.pre 预处理标签
8.span标签**
9.div标签***
10.sub标签
11.sup标签
12.hr标签
13.hn标签
14.HTML5中语义标签
特殊字符
15.多媒体标签
img***
a 标签***
第一种用法：超链接
第二种用法：锚点
audio 标签
video标签
16.表格标签**
基本表格
带标题的表格
跨行跨列表格
表格嵌套
17.列表标签***
ul
ol
dl
18.表单标签***
form标签
input
select
textarea
1.b/strong标签
这个标签是用于加粗文字的，一般用于强调某个部分的作用。
b/strong标签的使用 2022年3月23日 HTML文档也叫做web 页面 HTML 标签 HTML 标记标签通常被称为 HTML 标签 (HTML tag)。 HTML 标签是由尖括号包围的关键词,比如 HTML 标签通常是成对出现的
在以后使用中，推荐使用 strong 标签。
2.i/em 标签
它们的使用是让文字变为斜体
b/strong标签的使用 2022年3月23日 HTML文档也叫做web 页面 HTML 标签 HTML 标记标签通常被称为 HTML 标签 (HTML tag)。 HTML 标签是由尖括号包围的关键词,比如 HTML 标签通常是成对出现的
3.u标签
它的作用是给文字添加下划线
b/strong标签的使用 2022年3月23日 HTML文档也叫做web 页面 HTML 标签 HTML 标记标签通常被称为 HTML 标签 (HTML tag)。 HTML 标签是由尖括号包围的关键词,比如 HTML 标签通常是成对出现的
4.del删除线
它的使用是给文字添加删除线
b/strong标签的使用 2022年3月23日 HTML文档也叫做web 页面 HTML标签HTML 标记标签通常被称为 HTML 标签 (HTML tag)。 HTML 标签是由尖括号包围的关键词,比如 HTML 标签通常是成对出现的
5.br换行
不需要
b/strong标签的使用 2022年3月23日 HTML文档也叫做web 页面 HTML标签HTML 标记标签通常被称为 HTML 标签 (HTML tag)。
HTML 标签是由尖括号包围的关键词,比如 HTML 标签通常是成对出现的
6.p标签 *
这个标签是一个段落标签，它本身就自带了行间距。在这个标签中的文件会独占一行。
p标签的使用 HTML 不是编程语言，是一种超文本标记语言，用来制作网页的一门语言，由标签组成的，比如：图片标签、链接标签、视频标签... 所谓超文本，有两层含义：
html 可以加入图片、声音、动画、多媒体等内容（超越了文本的限制）
html 可以从一个文件跳转到另一个文件，与世界各地主机的文件连接（超级链接文本）
HTML 页面也称为 HTML 文档
HTML 文档的后缀名必须是.html 或 .htm，浏览器的作用是读取HTML文档，并以网页的形式显示出它们 HTML 文档里按下多次空格，在网页中只会显示一个空格，并且在 HTML 文档里按下回车键，在网页中也不会进行换行
7.pre 预处理标签
这个标签的作用是书写的内容与显示的样式内容相同。
pre标签 静夜思 床前明月光， 疑是地上霜。 举头望明月， 低头思故乡。
这个标签一般用于显示源码的。
8.span标签**
它是一个行内标签，它没有什么特殊的意义，但是在使用中却比较多。一般会接合 css 样式来修饰文本。
span标签 静夜思版本说明明代版本这是目前流传比较广泛的版本。
9.div标签***
它是一个块状标签，一般用于页面布局。
div标签 div标签是一个块状标签， 一个 div 标签会独占一行，它没有任意的属性， 但是我们可以给它自定义一个属性， 例如，id、class 等。
10.sub标签
这个标签的作用是指定下标，一般用于数字方面。
sub log2
11.sup标签
这个标签的作用是指定上标，一般用于数字方面。
sup 23=8
12.hr标签
这个标签用于给页面划水平线。不需要
hr 静夜思
床前明月光，疑是地上霜。举头望明月，低头思故乡。
标签属性说明：
size：用于指定线的粗线，值越大线越粗 width：用于指定线的宽度，值越大越宽 align：用于指定线的对齐方式，有以下三个值： left：居左对齐 center：居中对齐，它是默认值 right：居右对齐
13.hn标签
这个标签中的 n 是 1 ~ 6 的数字，一般用于标题。
hn h1
h2
h3
h4
h5
h6
14.HTML5中语义标签
这个标签是 HTML5 中定义的新的语义标签，有以下几个：
-
header：用于定义页面的顶部
-
article：用于表示文章的内容
-
section：用于定义内容的分块信息
-
nav：用于定义页面的导航部分
-
aside：用于定义页面的侧边栏
-
footer：用于定义页面的页脚部分
-
address：用于定义用户邮件、地址等信息
html5新标签的使用 这是头部信息
特殊字符
在 HTML 中有很多特殊字符，如下表所示
| 特殊字符 | 转义码 |
|---|---|
| 空格 | |
| < | < |
| > | > |
| 版权 | © |
15.多媒体标签
img***
这个标签的作用是在页面中引入图片
img标签 
标签属性说明：
src：这个属性非常重要，用于指定图片显示的路径，可以是相对路径，也可以是绝对路径。（简单来 说，在 windows 中带了盘符，在 Linux 中以/开头的路径，在链接中以 http:// 开头的就是绝对路径，其他都是 相对路径。相对路径的参考点就是这个对象本身。） width：用于指定图片显示的宽度，如果只指定宽，则高会根据宽度来等比例绽放 height：用于指定图片显示的高度，如果只指定高，则宽度会根据高度来等比例绽放。注意：width和height两个属性不要同时指定。 border：用于指定力图片显示的边框粗细，默认是无边框 alt：是在图片不能正常显示时才会显示这个文字内容 title：用于当鼠标移动到图片上时显示的提示信息。一般用于搜索引擎优化。
a 标签***
这个标签是用于作链接的标签。
第一种用法：超链接
a标签 百度
打开百度
属性说明：
href：这个属性是一个必须属性，用于指定要打开的目标地址 target：链接打开的方式，有以下几个值： - _blank：在新窗口打开 - _self：在本窗口打开，默认值 - _top：在父窗口打开，一般用于 frame 框架时 - _parent：在父窗口打开，一般用于 frame 框架时
第二种用法：锚点
锚点 底部 | demo2.html
demo2 demo1.html
audio 标签
这个标签是用于播放音乐的标签。常用支持格式为 mp3 格式。
audio
标签属性说明：
1. controls：它是用于对播放器进行控制器的，即显示播放器的控制按钮 2. src：用于指定音频文件的路径 3. autoplay：指定是否自动播放 4. loop：指定是否循环播放
video标签
video
标签属性说明：
1. src：指定要播放的视频地址，可以是相对路径，也可以是绝对路径。这个标签所支持的视频格式不多， 目前只把持 mp4、ogg 两种 2. controls：显示播放控制按钮 3. autoplay：自动播放 4. loop：自动循环 5. width：设置播放器的宽度 6. height：设置播放器的高度
16.表格标签**
在我们进行数据展示时，很多时候都会用到表格，特殊是在后台进行数据管理时，或者显示列表数据时，就会用表格。
要使用表格就需要用到 table 标签，而表格是由行和列组成。行的标签是 tr，而列的标签是 td 或 th。
基本表格
简单表格
1 2 3 4 5 6
表格的标签和属性说明：
table：用于绘制表格 tr：用于绘制表格的行 td：用于绘制表格的列（单元格） width：指定表格的宽度，也可以是 td 的属性 border：指定表格的边框粗细 cellspacing：指定单元格之间的间距 cellpadding：指定单元格边框与单元格中内容的距离 align：用于指定表格对齐方式： - left：左对齐，默认值 - center：居中对齐 - right：右对齐 align属性可以是 table，也可以是 tr，还可以是 td。如果是 table 的，表示对整个表格有效；如果是 tr 的，表示对当前行有效；如果是 td 的表示只对当前的单元格有效。
带标题的表格
带标题的表格
第二个表格 编号 姓名 年龄 1 2 3 4 5 6 7 8 9 hello
使用 caption 来指定表格的标题，使用 thead 标签来指定表格的头，tbody 来指定表格数据区，tfoot 指定表格的尾部。
td 和 th 的区别：
-
td中的内容是普通格式，而 th 中的内容是加粗的格式
-
td中的内容是左对齐，而 th 中的内容是居中对齐
跨行跨列表格
跨行跨列的列表
1 3 4 5 6 7 8 9 10 11
相关属性说明：
1. colspan：用于指定要跨多少列，它的值是一个数字 2. rowspan：用于指定要跨多少行，它的值是一个数字
表格嵌套
表格嵌套
1 2 3
41 42 43 44
17.列表标签***
在 HTML 中，列表标签有以下几种：
-
ul
-
ol
-
dl
ul
它是无序列表标签
ul
- 西安
- 北京
- 重庆
- 1
- 2
- 3
标签和属性说明：
ul：用于指定无序列表
li：指定列表中的某一项
type：指定无序列表的格式，有以下几个值：（了解）
- disc：实心圆形，默认值
- square：实心方形
- circle：空心圆形
ol
它是有序列表
ol
- 北京
- 上海
- 天津
- 北京
- 上海
- 天津
- 北京
- 上海
- 天津
- 北京
- 上海
- 天津
type属性有以下值：
1. 数字：默认值 2. a：以小写字母 a 开始 3. A：在大写字母 A 开始 4. i：以罗马字开始
dl
它数据列表
dl
- 陕西地名
- 西安
- 潼关
- 宝鸡
18.表单标签***
form标签
这个标签是用于表单提交的标签，一般在与用户交互时就会用到 form 标签。
form表单标签
标签属性说明：
name：用于给这个表单取一个唯一的名称，便于后续使用 js 来操作这个表单
action：表单提交的地址
method：表单提交的方式，有以下两个值：
- get：表单以 get 方式提交
- post：表单以 post 方式提交
补充get和post提交的区别：
get提交的数据会以参数的形式体现在浏览器地址栏中，而 post提交的数据是在请求头中
get提交方式提交的数据不能超过4k大小，而post提交方式理论上是没有大小限制的
input
这是表单元素中非常重要一组标称，它有很多类型：
text：最常见的类型，用于提交文本字符串内容
password：用于提交密码数据
radio：单选按钮
checkbox：多选按钮
submit：提交按钮
reset：重置按钮
button：普通按钮
image：图片按钮
file：文件上传域
form2表单元素之input的使用
select
select是下拉列表标签
form表单之下拉列表
标签属性说明：
name：表单提交时要获取对应元素值是所需要的属性 value：指定select中每一个子元素的值 size：指定 select 可看到的元素个数，默认值是 1 multiple：表示可以多选
textarea
这个标签是用于输入大文本内容的标签。
form表单之textarea
标签属性说明：
name：用于获取元素值的属性 cols：用于指定文本框的宽度 rows：用于指定文本框的高度