（一）、HTML语法规范
1.标签分类
2.标签关系
包含（父子）关系：
<head>
<title> </title>
</head>
并列（兄弟）关系：
<head> </head>
<body> </body>
（二）、基本结构标签
1.第一个HTML网页
每一个网页都会有一个基本的结构标签，页面内容也是在这些基本标签上书写的。
<html> //HTML根标签
<head> //文档的头部
<title>我的第一个页面</title> //文档的标题
</head>
<body> //文档的主体，网页的显示内容
你我之间，黑马洗练。
</body>
</html>
（三）、网页开发工具
1.vs code的使用
CTRL+N 新建文件
CTRL+S 保存文件
CTRL + 放大视图
CTRL - 缩小视图
!+TAB 生成骨架
ALT+B 打开浏览器
2.骨架新增代码
<!DOCTYPE> 文档类型声明标签(必须是第一行) <!DOCTYPE html>
lang 定义文档的显示语言(en英语网页;zh-CN中文网页) <html lang="en">
charset 字符集,方便计算机存储和识别各种文字(必须写) <Meta charset="UTF-8">
（四）、HTML常用标签
1.标题标签
h——head,头部、标题
<h1>一级标题</h1>
<h2>二级标题</h2>
:
:
<h6>六级标题</h6>
标签语义：作为标题使用，依据重要性递减
特点： 1.加了标题的文字会加粗，字号会变大
2.每个标题独占一行
2.段落标签和换行标签
p——paragraph，段落
<p>我是段落标签</p>
标签语义：把HTML文档分为若干段
特点： 1.文本会根据浏览器窗口大小自动换行
2.段落与段落之间会有一定的空隙
br——break,换行
换行标签
<br />
标签语义：强制换行
特点： 1.是单标签
2.
是另起一行，与段落不同，行与行之间无空隙
3.文本格式化标签
<strong></strong> / <b></b> 加粗
<em></em> / <i></i> 倾斜
<del></del> / <s></s> 删除线
<ins></ins> / <u></u> 下划线
4.div和span布局标签
div——division 分割
span——span 跨度
<div>这是头部</div>
<span>今日价格</span>
特点：1.
标签用来布局，但是一行只能放一个，大盒子2.标签用来布局，一行上可以有多个，小盒子
5.图像标签
img——image 图像
<img src="imaname.jpg" />
src 标签的必须属性，它用于指定图像文件的路径和文件名
alt 替换文本，图片不能显示时，显示替换文本
title 提示文本，鼠标放到图片上，显示文字
width 设置图像的宽度
height 设置图像的高度
border 设置图像的边框粗细
PS: 1.属性要写到src后
2.属性之间不分先后顺序，属性与属性之间要以空格分开
3.属性采取键值对的方式，即 属性=“属性值”
6.路径
目录文件夹：普通文件夹，存放相关素材，HTML文件、图片等
根目录：打开文件夹的第一层就是根目录
路径：相对路径和绝对路径
相对路径：包含同一级路径，下一级路径，上一级路径
<img src="baidu.jpg" /> //同一级路径
<img src="image/baidu.jpg" /> //下一级路径 /
<img src="../baidu.jpg" /> //上一级路径 ../
绝对路径：指目录下的绝对位置，通常是从盘符开始的路径
<img scr="D:\文件\HTML\baidu.jpg" /> 电脑绝对地址
<img scr="https://i0.hdslb.com/bfs.png" /> 网络绝对地址
7.超链接标签
a——anchor 锚
超链接标签，从一个页面链接到另一个页面
<a href="跳转目标" target="目标窗口弹出方式"> 文本或图像 <a />
href 指定链接目标的URL地址（必须属性）
target 指定链接页面的打开方式，其中_ self 默认值为在当前页面打开，_ blank为在新窗口中打开方式
链接分类
1.外部链接：打开别的网站
2.内部链接：网站内部页面的相互链接
3.空链接：#
4.下载链接：如果href链接为文件或压缩包地址，则点击后会直接下载该压缩包
5.网页元素链接：网页中的各种元素都可以添加链接，例如图片、表格、视频、音频等
6.锚点链接：点击链接，快速定位到页面的相应位置
方法：在链接href属性中，设置属性值为 #名字 的形式，找到目标位置标签，里面添加一个id属性=刚才的名字
<h3>外部链接</h3>
<a href="http:\\www.qq.com" target="_self">腾讯</a> 当前窗口打开
<br />
<a href="http:\\www.qq.com" target="_blank">腾讯</a> 新建窗口打开
<h3>内部链接</h3>
<a href="09-图像标签.html" target="_self">10-路径</a> 当前窗口打开
<h3>空链接</h3>
<a href="#" target="_self">空链接</a> 当前窗口打开
<h3>下载链接</h3>
<a href="压缩包.zip" target="_self">下载链接</a> 当前窗口打开
<h3>网页元素链接</h3>
点击图片访问相应的网站
<br />
<a href="http:\\www.baidu.com" target="_self"><img src="Squirrelnesting.jpg" width="500"></a>
<br />当前窗口打开
<h3>锚点链接</h3>
<a href="#zuoze" target="_self">锚点链接到作者</a>
...内容
<h id="zuoze">作者：孔某</h><br />
2020.03.31
8.base标签
base可以控制页面中的所有a标签的打开方式（当前页面打开，还是新建窗口打开）
target 属性 控制整个页面的链接跳转方式
href 基于当前链接地址进行跳转，如果没有基于当前链接则不受影响
<base target="_blank" href="https://www.baidu.com">
（五）、注释和特殊字符
1.注释标签
<!--文字-->
快捷键CTRL+/
2.特殊字符
在HTML中一些特殊的符号很难直接使用，此时将用字符代替
特殊字符 字符代码
空格
< <
> >
& &
￥ ¥
©(版权) ©
®(注册商标) ®
℃ °
± ±
× ×
÷ ÷
² ²
³ ³
