超文本标记语言，主要是通过HTML标签对网页中的文本，图片，声音等内容的描述。

(1) 双标签

内容 标签名>

(2) 单标签 ,也称为空标签，指的是一个标签号即可完整描述某个功能

单标签数量很少

(1)嵌套关系

(2)并列关系

建议： 如果两个标签之间是嵌套关系，子元素最好缩进一个tab的身位，如果是并列关系，标签对齐。

DW :Dreamweaver

Sublime3

WS : WebStorm

HB : 飞一样的编码

VSCode ：微软

sublime的使用

生成HTML骨架的方法：

(1) html:5 + tab键

(2) ! + tab键

这句话的意思是告诉我们使用的是html的哪个版本

HTML有很多的版本，我们需要告诉用户和浏览器使用的版本号，标签位于文档的最前面，用于向浏览器说明当前文档使用哪种HTML或XHTML标准规范，必须在开头的位置使用这个标签为所有的文档指定版本和类型，这样浏览器才能够按照指定的文档类型进行解析。

注意：一些老的网站可能用的还是老版本的文档类型比如XHTML之类的， 但是我们学习的是HTML5，这个文档类型有很好的兼容性(向下兼容原则)。

utf-8是目前最常用的字符集编码方式，其他的还有gbk和gb2312

gb2312： 简单中文，包括6763个汉字BIG5：繁体中文，港澳台使用GBK： 包含全部中文字符，是GB2312的扩展，加入对繁体字的支持，兼容GB2312UTF-8： 包含了全世界所有国家需要用到的字符

标签语义化：标签的含义标签语义化的原因：

(1)方便代码的阅读和维护

(2)让浏览器或者网络爬虫能够很好的解析，从而更好分析其中的内容

(3)使用语义化标签会有更好的探索引擎优化核心： 在合适的地方给一个最为合理的标签原则： 先确定语义的HTML，再选择合适的CSS语义好不好： 当去掉CSS之后，网页的结构依然组织有序，并且有良好的可读性，不管是谁都能够看懂这块内容是什么。

首先，要区分HTML与CSS，这是两种不同的语言， 现在学的是结构，只写HTML标签，认识标签，不会给结构标签指定样式。 HTML标签很多，常用的一定要记住，同时要学会如何查看学习手册。

排版标签： 用于网页布局

标题标签(熟记)

有6个等级的标题标签： h1——h6

标题标签的语义：作为标题使用，并且依据重要性进行递减

基本语法格式为：

** 注意：h1标签应为重要，尽量少使用，一般是用于logo

段落标签

默认情况下，文本在一个段落中会根据浏览器窗口的大小自动换行。

水平线标签

horizontal ： 横线

显示的是一条水平线，用于将段落与段落分隔开。

换行标签

单词：break，打断，换行

div span标签(重点)：这两个是没有语义的，是用于网页布局的两个盒子

div : division的缩写， 分割，分区的意思，span ：跨度，跨距，范围

文本格式化标签(熟记)

在网页中，有时需要为文字设置粗体，斜体或者下划线效果，此时使用HTML的文本标记语言进行标记，使文字以特殊方式显示：

文字以粗体方式显示

文字以斜体方式显示

文字以加删除线方式显示

文字以加下划方式显示

** 标签属性

属性就是特性，可以使HTML标签提供更多的信息

基本语法

标签可以有多个属性，必须要写在开始标签中，位于标签名的后面属性之间不分先后顺序，标签名与属性、属性与属性之间均以空格分开任何标签的属性都有默认值，省略该属性则取默认值采取键值对的格式

图像标签(重点)

基本语法格式

必须属性：src，指定图像文件的路径和文件名 标签属性

属性属性值描述srcURL图像的路径alt文本图像不能显示时的替换文字title文本鼠标悬停时显示的内容Width＜/td>像素(XHTML不支持%页面百分比)图像宽度Height＜/td>像素(XHTML不支持%页面百分比)图像高度border数字设置图像边框的宽度

链接标签(重点)

单词：anchor的缩写，锚，铁锚

基本语法格式：

(1)href 用于指定链接目标的URL地址，当使用href标签时，她就具备了超链接的功能。 hypertext reference的缩写

(2)target属性：用于指定链接页面的打开方式，其取值有_self和_blank两种，其中self是默认值，_blank是在窗口中打开方式

(3)注意：

①外部链接需要添加 ：http:// + 网址

② 内部链接：直接链接内部页面名称即可

③ 如果在编写的时候没有确定超链接的链接位置，通常将href的属性值定义为#， 即 表示该链接暂时是一个空链接

④ 不仅可以创建文本超链接，在网页中的元素，比如图片，音频，视频，表格等都可以创建超链接。

锚点定位

通过创建锚点链接，用户能够快速定位到目标内容。创建锚点链接分为两个步骤：

使用  创建链接使用相同的id名标注跳转目标的位置 base标签： 可以设置整体链接的打开状态

基本语法格式：  单标签

比如： 在标签之间写 则表示页面中的链接都会在新窗口中打开目前学过的单标签：img,br,hr,base 特殊字符标签(理解)

特殊字符描述字符代码？空格符大于号&和号￥人民币。摄氏度？版权？注册商标2平方，上标23立方，上标3×乘号÷除号±正负号

注释标签

多写注释，这是非常好的代码习惯，会使得团队协作顺畅注释是写给队友看的，浏览器是不执行的注释的内容不会显示在浏览器的窗口当中，但是作为HTML文档内容的一部分，也会被下载到用户计算机上，查看网页源代码时就可以看到基本语法格式：sublime中的注释HTML代码的快捷键：单行注释：Ctrl+/ ；多行注释：选中后ctrl+shift+/

实际工作中，通常新建一个文件夹专门用于存放图像文件，这时再插入图像，就需要采用“路径”的方式来指定图像文件的位置。

路径可以分为： 相对路径和绝对路径

相对路径：

图像文件和HTML文件位于同一文件夹：只需要输入图像文件的名称即可，如 ：图像文件位于HTML文件的下一级文件夹：输入文件夹名和文件夹，之间用/隔开， 如： 图像文件位于HTML文件的上一级文件夹：在文件名之前加“…/”，如果是上两级，则需要使用“…/…/”，以此类推。比如： 绝对路径：

或者完整的网络地址，例如：

无序列表ul (重点)

无序列表的各个表项之间没有顺序级别之分，是并列的，基本语法如下：

(1)中只能嵌套标签，直接在之间输入其他标签或者文字的做法是不被允许的。

(2)之间相当于一个容器，可以容纳所有元素。

(3)无序列表会带有自己的样式属性，放下那个样式(比如说每一项无序列表前面的黑点)，让CSS来做！

有序列表ol (了解)

(1)中只能嵌套标签，直接在之间输入其他标签或者文字的做法是不被允许的。

(2)列表项前面的序号设置用CSS来做

自定义列表 (理解)

自定义列表常用于对术语或名词进行解释和描述，定义列表的列表向前没有任何项目符号，基本语法格式如下：

术语或名词进行解释和描述，定义列表的列表向前没有任何项目符号，基本语法格式如下：