共计 2558 个字符，预计需要花费 7 分钟才能阅读完成。
网页开发工具（vscode）
1、文档类型声明，作用就是告诉浏览器使用哪种 HTML 版本来显示网页。
这句代码的意思是: 当前页面采取的是 HTML5 版本来显示网页。
2、Lang 用来定义当前文档显示的语言。
1.en 定义语言为英语
2.zh-CN 定义语言为中文
简单来说, 定义为 en 就是英文网页, 定义为 zh-CN 就是中文网页。
3、字符集 (Characte rset) 是多个字符的集合。以便计算机能够识别和存储各种文字。
在
标签内，可以通过 标签的 charset 属性来规定 HTML 文档应该使用哪种字符编码。
charset 常用的值有:GB2312、BIG5、GBK 和 UTF-8，其中 UTF-8 也被称为万国码，基本包含了全世界所有国家需要用到的字符。
如下顺序（一般模板自动生成）：
4.1 标签语义。
学习标签是有技巧的，重点 是记住每个标签的语义。简单理解就是指标签的含义，即这个标签是用来干嘛的。
根据标签的语义，在合适的地方给一个最为合理的标签，可以让页面结构更清晰。
如标题标签、段落标签等组成一篇明了的文章。
总结：添加语义标签会让整个界面更加整洁明了。
4.2 标题标签
– 。
为了使网页更具有语义化，我们经常会在页面中用到标题标签。HTML 提供了 6 个等级的网页标题即
–。
特点:
1. 加了标题的文字会变的加粗，字号也会依次变大
2. 一个标题独占一行。
4.3 段落和换行标签。
在网页中，要把文字有条理地显示出来，就需要将这些文字分段显示。在 HTML 标签中，
标签用于定义段落，它可以将整个网页分为若干个段落。
如：
我是一个段落标签
特点:
1. 文本在一个段落中会根据浏览器窗口的大小自动换行。
2. 段落和段落之问保有空隙。
在 HTML 中，一个段落中的文字会从左到右依次排列，直到浏览器窗口的右端，然后才自动换行。如果希望某段文本强制换行显示，就需要使用换行标签
。
注意：直接在想要换行的地方插入
就行。
特点:
1.
是个单标签.
2.
标签只是简单地开始新的一行，跟段落不一样，段落之间会插入一些垂直的间距。
4.4 文本格式化标签。
在网页中，有时需要为文字设置粗体、科体或下划线等效果，这时就需要用到 HTML 中的文本格式化标签，使文字以特殊的方式显示。
标签语义: 突出重要性, 比普通文字更重要。
内容格式如下：
重点 记住 加粗 和 倾斜。
4.5
div 是 division 的缩写, 表示分割、分区（是大盒子）。span 意为跨度、跨距（是小盒子）。
div 一个人独占一行，span 跨行，并列。
代码：
效果：
特点:
- 标签用来布局，但是现在一行只能放一个。大盒子
- 2.标签用来布局，一行上可以多个。小盒子
4.6 图像标签和路径 ( 重点)
1. 图像标签。
在 HTML 标签中，
标签用于定义 HTML 页面中的图像。
单词 image 的缩写，意为图像。
src 是
标签的必须属性，它用于指定图像文件的路径和文件名。相当于 path。
注意：Jpg 要和 html 在同一个文件夹里（同一空间），这样才可以把 jpg 导入进去。
如下将图片和 HTML 放在 todesk 下：（发现 png 格式也可以，jpg 和 png 都 ok）
小 top：要换行，加个
或者给一个标题标签就可以。 图像的一些使用语法：
Alt：(空格隔开，键值对形式)
Alt 的效果：
剩下的属性用法与 alt 一样。
Title 的效果：
多加了移到图片上的文字：这是 wqh 先生思密达。剩下的宽度长度和边幅就不展示了没多大意义，写法都和上面一样。
4.7 图像标签和路径 ( 重点)
1. 路径(前期铺垫知识)
（1）目录文件夹和根目录
目录文件夹: 就是普通文件夹，里面只不过存放了我们做页面所需要的相关素材，比如 html 文件、图片等。例如：
根目录: 打开目录文件夹的第一层就是根目录。例如：
（2）VSCode 打开目录文件夹
4.8 图像标签和路径 ( 重点 )
解释理解：在 vscode 中操作文件夹内的图像，在编辑 HTML 文件的同级或者上下级等。
相对路径：同级或者上下级。
简单来说，图片相对于 HTML 页面的位置。
绝对路径：就是 HTML 或者图像所在电脑的位置。
例如：C:UsersDesktop 网站
写法：
网站上的图片也可以获取，属于绝对路径。（右键复制图片的地址即可）
注意：绝对路径（）与相对路径（/）是不一样。
4.9 超链接标签 ( 重点): 从一个页面到往另外一个页面的地方。
1. 链接的语法格式:
单词 anchor[‘ænka(r)]的缩写，意为: 锚。
属性作用：
注意：_self 是当前窗口打开页面显示。_blank 是重新打开一个窗口显示。文本或图像：相当于你要展现给别人看的东西，文字或者图像。
2. 链接分类:
1. 外部链接: 例如百度。
2. 内部链接: 网站内部页面之间的相互链接, 直接链接内部页面名称即可，例如
首页。 注：内部链接就是 html 文件内的链接：一个 html 文件塞进另外一个 html 内。在浏览器内和外部来链接同理，点击转到另外的地方。
个人理解：外部链接是我们的 html 文件跳到别人的网页，如腾讯 qq、百度等
内部链接是我们的 html 文件跳到自己做的另外的网页（开发过程中不具备专业的域名或者网站名字）。
空连接：这个是空连接。
下载链接：如果 href 里面地址是一个文件或者压缩包，会下载这个文件。
如下举例：
小 tip：网页元索链接: 在网页中的各种网页元素，如文本、图像、表格、音频、视频等都可以添加超链接. 例如：
锚点链接（一般用法类似于目录，快速定位到页面某个位置）：
在链接文本的 href 属性中, 设置属性值为 #名字的形式, 如
第 1 集。 找到目标位置标签，里面添加一个 id 属性 = 刚才的名字，如:
还有！！！点击跳转到 222.html 文件内
在 222.html 文件内点击返回则又回跳转到 111.html 内。（记得不要加 #，否则就固定在当前 html 文件内了）
当然以上属于两个文件之间的相互操作，如果要在一个文件内，从目标位置回到锚点处，则可以在锚点处做一个反锚点即可。效果如下：
注意：这里有个小差别。因为是重新建立一个反向的锚点链接，所以当回去之后，到的位置就不是我们鼠标点的那个原来的锚点处了（这个问题以后想起来就解决。。）。当然也有好的地方，就是不管文章多长，回到顶部 这句语句可以无限生产了。
记住噢是每一个回到顶部都生效哈！！！
注：图片上的美女仅作教学示范，无其他传播；本页面图片也仅学习！
原文地址: HTML 简述 3
