首先我们先介绍一下网页：
网页时构成网站的基本元素，它通常由图片，链接，文字，声音，视频等元素组成。通常我们看到的网页，常见以.htm或.html后缀结尾的文件，因此我们把它俗称为HTML文件。
HTML指的是超文本标记语言，它是一种用来描述网页的一种语言。标记语言是一套标记标签。
超文本的含义：
（1）可以加入图片、声音、动画、多媒体内容，超出了文本的限制.
(2) 可以从一个文件中跳转到另一个文件，与世界各地的主机的文件连接（超级链接文本）.
常用的浏览器：
浏览器是网页显示、运行的平台（目前来说谷歌浏览器的应用占大部分，所以我们在打开文件时使用的时谷歌浏览器较多）
内核：负责读取网页的内容，整理讯息，计算网页的显示方式并且展示出来（webkit/blink内核）
web标准的构成：
主要包括结构、表现、行为三个方面。
| 结构 | 结构用于对网页元素进行整理和分类（HTML) |
| 表现 | 表现用于设置网页元素的版式、颜色、大小等外观样式（CSS) |
| 行为 | 行为是指网页模型的定义及交互的编写（JAVASCRIPT） |
结构使用HTML来书写，表现使用CSS来书写，行为使用JAVASCRIPT书写。
HTML语法规范：
(1) 所有的标签都需要写在里面，大部分都是成对的出现。如下：
内容
（2）当然由成对出现的也有单个的标签例如换行标签：
标签关系：
双标签关系可以分为两类：包含关系和并列关系。
包含关系：
包含关系就类似于父子关系，上面的形式为，head是title的父亲title是head的儿子。
并列关系：
并列关系就类似于现实生活中的兄弟关系。
HTML基本结构标签
| HTML标签 | 页面中最大的标签，其中包含其他标签，称为根标签 | |
| 文档头部 | 注意在head标签中我们必须设置title标签 | |
这就可以在vscode上运行得到属于自己的一个网页，形式如图：
HTML文档的后缀名必须是.html或.htm,浏览器的作用就是读取HTML文档，并以网页的形式展示。 学习HTML最重要的就是理解每一个标签的语义 根据标签的语义，在合适的地方给一个最合理的标签，让页面清晰. 标题标签： ——一共存在六级标题， 为一级标题以此类推 |
重点记忆加粗与倾斜标签即可，常用的为两个标签。
运行实现功能的代码如下：
小侯不摆烂 我是加粗标签加粗但不是很常用 倾斜倾斜 删除 删除 下划线 下划线实现在网页上的效果如下图所示：
常用标签：
和标签（用来布局的）
和是没有语义的，它们就是一个盒子，用来装内容的。
一个人独占一行内容是个大盒子
是跨距，小盒子（一行里面可以放多个）
特点：用来布局，但是现在一行只能放一个.
运行的代码如下：
小侯不摆烂 我是加粗标签加粗但不是很常用 倾斜倾斜 删除 删除 下划线 下划线
大盒子 大盒子 布局盒子 布局盒子 运行的成果如下：
会自动换行，因为一个之占一行内容。
不会换行，一行可以存放多个。
图像标签和路径：
1.图像标签（用于定义HTML页面中的图像的）
形式如下：
src是的必须属性，它用于指定图像文件的路径和文件名.
所谓属性：简单理解就是属于这个图像标签的特性.
代码如下所示：
小侯不摆烂 
图片需要和HTML的文档存储在一起。
具体的表现行使如下:
因为第一个图片的格式不对所以不能打开显示的就是alt的内容，而第二张图将鼠标放过去之后会出现title中的内容，第三个图是修改了高度和宽度所展示出来的图片。
注意：
（1）图像标签可以拥有多个属性，必须写在标签名的后面。
（2）属性之间不分前后顺序，标签名与属性，属性与属性以空格分隔开。
（3）属性采取键值对的格式即key=”value”的格式，属性=属性值。
路径：
（1）目录文件夹和根目录
实际工作时文件不可以乱放都需要放入一个文件夹中便于管理。
目录文件夹：普通文件夹，只不过存放了一些做网页的相关素材。
根目录：打开目录文件夹的第一层就是根目录。
相对路径：以引用文件所在的位置为参考基础，而建立出的目录路径。
简单的来说，图片相对于HTML页面的位置
| 相对路径的分类 | 符号 | 说明 |
| 同一级路径 | 图像文件与HTML文件在同一级 | |
| 下一级路径 | / | 图像文件位于其文件的下一级 |
| 上一级路径 | ../ | 图像文件位于其文件的上一级 |
例如：
绝对路径：
绝对路径是指目录下的绝对位置，直接到达目标位置，通常是从盘符开始的路径。
例:”D:\wed\img\logo.gif”或完整的网络地址
超链接标签：
标签用于定义超链接，作用是从一个页面链接到另一个页面，
1.语法格式
文本/图片
点击图片/文字即可进行跳转。
| 属性 | 作用 |
| href | 用于指定链接目标的URL地址（必须属性） |
| target | 用于指定链接页面打开的方式，_self为默认方式在此页面直接跳转，_blank在新的窗口打开 |
2.链接分类
（1）外部链接
例：百度
特定格式:http：//www……..即可
（2）内部链接
网站内部页面之间的相互链接。
直接在href=” “在引号之中直接写自己所书写的html文件的文件名即可跳转。
（3）空链接(#)
空链接是占位的链接。
文件
（4）下载链接
名字
（5）网页元素链接
点击图片即可跳转
（6）锚点链接
是使用在一个网页中，内容太长不好寻找指定内容是所设置的链接，可直接找到想要查找的内容。
在href属性中，设置属性值为#名字的形式。
如：第二
找到目标位置标签，咋里面添加一个id属性=设置的名字即可
如:
第2集
代码如下：
小侯不摆烂 对角巷乐队
6月12日，太合音乐集团旗下“在水星”厂牌服务艺人对角巷乐队全新单曲《我们》正式上线，这是他们继单曲《Hold You Tight》发行之后的又一温暖治愈系音乐作品。 如果说《Hold You Tight》想表达的是只属于某一个人的专属情歌，那这首《我们》则是送给每一个努力生活的人。
一起去吧，更远的地方
千年前，万里外的星星，发出的光芒，跨过时间和空间，照耀着此刻的我们。在时间长河和漫漫宇宙中留下了痕迹。
此时此刻，人群中的我们，做出的每一件不起眼的小事，也都将在这个世界留下它的痕迹，这个痕迹或深或浅，或长或短。
此时此刻，人群中的我们，做出的每一件不起眼的小事，也都将在这个世界留下它的痕迹，这个痕迹或深或浅，或长或短。
单曲《我们》延续了对角巷以往温暖的风格，主唱王艺丰用自己的歌声唤醒人们心中的理想和希望。对于整个世界来说，我们都是无比渺小的存在，但是这个世界就是由无数个我们所构成的，每个人在属于自己的领域里都是不可比拟的。我们一直前行，心存希望和美好，用自己的微薄力量温暖和保护身边的人，守护自己的小小世界。我们总说的诗和远方，每个人都在追寻的路上，碌碌无为的一生并不是我们想要的，可以平凡，但拒绝平庸。一起吧，去更远的地方，看更美的风景。
让我们在山的顶峰相遇吧
在日月的璀璨间闪耀 这首歌曲是由主唱王艺丰包揽词曲，邀请到陈禹骁进行制作，整支乐队也参与到编曲的工作当中。对角巷的每一首歌曲都希望给歌迷们最好的呈现，同时也给人们带来温暖和感动。我们都在这个快节奏的时代中努力地生活着，看似平凡，但是我们所有的努力都是我们存在的价值和意义。
跳转去的网页代码是:
在日月的璀璨间闪耀 对角巷——在日月的璀璨间闪耀
我们追逐着夕阳
想在它消失前赶到天桥上
忙碌的人去的方向
是不是他心所想
曾经幻想俯瞰世界
如今大多病死荒野
残存的热血挣扎于
疲惫却不肯睡去的夜
仰望仍看不见星河
低头还是熟悉的坎坷
只剩一颗燃烧的心
在日月的璀璨间闪耀着
世间安得双全法
不负远方不负她
头也不回的世界啊
能让我们拥有这一切吗
手机里的音乐在响
逃避着不去想明天会怎样
可谁能逃得过时光
努力的人更绝望
曾经幻想俯瞰世界
如今大多病死荒野
残存的热血挣扎于
疲惫却不肯睡去的夜
仰望仍看不见星河
低头还是熟悉的坎坷
只剩一颗燃烧的心
在日月的璀璨间闪耀着
世间安得双全法
不负远方不负她
头也不回的世界啊
能让我们拥有这一切吗
仰望仍看不见星河
低头还是熟悉的坎坷
只剩一颗燃烧的心
在日月的璀璨间闪耀着
世间安得双全法
不负远方不负她
头也不回的世界啊
我们要拥有这一切呀！
代码运行之后的效果如下：
跳转之后的网页为：
注释标签：
注释方式
快捷键为Ctrl+/
改标签的含义是为了之后自己回头来理解自己所书写的内容
特殊字符：
| 字符 | 字符代码 |
| 空格 |   |
| < | < |
| > | > |
还有很多其他类的特殊字符因为太多太繁杂并且不常用所以这里就不一一书写了，有需要的可以在网页中自行搜索。
表格标签：
作用：显示、展示数据可读性好。
基本语法：
表示一行 表示一个单元格 ………………………………..
……………………………….
一个tr是一行，一个td是一个单元格，两个内容都可以有多个。
表头单元格标签：
表格属性:
| 属性名 | 属性值 | 描述 |
| align | left,center,right | 表格元素的对齐方式 |
| border | 1或0 | 规定是拥有边框，默认没有 |
| cellpadding | 像素值 | 文字距离边框的距离 |
| cellspacing | 像素值 | 单元格与单元格之间的空白区域默认为2 |
| width | 像素值 | 规定表格的宽度 |
这些属性都是写在
| 姓名 | 年龄 | 性别 |
|---|---|---|
| 小叶 | 20 | 女 |
| 小李 | 19 | 女 |
| 小庞 | 20 | 男 |
运行之后：
在表格之中添加一个宽度设置为160时运行结果如下：
我们来实践一个合并单元格，代码如下所示：
小侯不摆烂 事件 时间 拍摄照片 2022.5.27 学习 2022.5.28 写博客
运行结果如下图所示：
列表标签（用来布局页面）
分类：无序、有序、自定义列表
无序列表：
- 标签表示页面中无序列表，而列表项使用标签定义。
- ,
- 其中两个为兄弟关系。
2.
- 和
- 个数无限制，经常一个
- 包含多个
列表所有的整合代码如下所示:
小侯不摆烂 我爱吃的零食:
- 薯片
- 汉堡
- 鸡腿
我爱吃的水果的排序
- 橘子
- 苹果
- 火龙果
自定义列表
- 乐队名称
- 黑屋乐队
- 对角巷乐队
- 时间不够以后乐队
- 蛙池乐队
- 成员
- 王泽南
- 郭玉都
- 李巧巧
运行的结果如下图所示：
表单标签：
使用表单的目的是收集数据（注册账号时可以利用）
在HTML中，一个表单通常由表单域、表单控件、提示信息构成。
表单域：
包含表单元素的区域
定义表单域，已实现用户信息的收集和传递。
会把范围内的表单元素信息直接提交给服务器。
各种表单控件
属性 属性值 作用 action url地址 用于指定接收并处理表单数据的读物程序的url地址 method get/post 提交方式 name 名称 用于指定名称，用来区分页面的多个表单 表单控件（表单元素）：
这些表单元素就是允许用户在表单中输入或者选择的内容控件。
表单元素（输入信息）单标签
中包含一个必须属性type根据其值的不同，输入有很多的形式。
根据type的不同形式也将不同
type的属性值
button 定义可点击按钮 checkbox 定义复选框 file 定义输入字段和浏览按钮没提供文件的上传 hidden 定义隐藏的输入段 image 定义图像形式的提交按钮 password 定义密码字段，该字段被掩码 radio 定义单选按钮 reset 定义重置按钮，会清楚表单中的所有数据 submit 定义提交按钮，将表单的数据输出给后台 text 单行输入字段可输入文本。默认20个字符 type类型外的属性
name 自定义 定义input元素的名字 value 自定义 规定input元素的值 checked checked 规定首次出现时默认被选中的值 maxlength 正整数 规定输入字段中的最大长度 1.name和value是每个表单元素都应该有的属性，主要给后台人员使用
2.name表单元素的名字，要求单选，复选按钮要分别相同
3.checked属性主要针对于单选框和复选框，默认选择项
标签：
下拉表单（选择地址位置时可以使用）
可节约空间
格式：
<option
…………………….
1.中至少包含一对
2.在中定义select=”select”时当前选项即为默认项
textarea文本域元素（类似于留言板）
使用场景：内容过多，一行写不下可以使用该标签
一下的代码是对表单的简单应用：
小侯不摆烂 指尖非遗注册页面
用户 密码 性别 我喜欢的食物 薯条 鸡腿 汉堡 炸鸡 位置 山西 福建 广东 甘肃 云南 陕西 运行的结果如下：
这篇博客详细的介绍了HTML的各个标签的应用。
请保持初心，追寻自己想要追寻的，想得到的现在就去做！！
默认列表前有一个黑点。
特点：
（1）无序列表，表项中无顺序之分，是并列的。
（2）
中只能嵌套
直接在其中写其他的标签是不被允许的。
（3）可以放任意的东西
有序列表：
列表之中的元素有顺序之分。
之间同样使用
与无序列表的特点相同
自定义列表：
常用于对名词，术语解释或描述，定义列表前无任何项目符号。
- 定义描述列表定义项目名字 描述每一个名字
注意:
1.dl中只可以包含