一、HTML全新结构
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>第一个网页</title>
</head>
<body>
</body>
</html>
<!DOCTYPE > ：表示当前的html文件是html5的文档(html5的规范)
<html lang="en"> ： lang表示开发语言
<meta charset="UTF-8"> ：charset表示使用的字符集。UTF-8支持中文、gbk、GB2312、iso-8859-1
<html></html> : 页面的根标签
<head></head> ：头部标签，页面的常规信息
<body></body>：主体标签。页面的主体信息
二、标签
1、标签分类：
（1）双标签：<标签名>内容</标签名> （2）单标签：<标签名/>
2、标签的关系
（1）嵌套关系： Dreamweaver菜单栏由各种菜单命令构成，包括文件、编辑、查看、插入、修改、格式、命令、站点、窗口、帮助10个菜单项。 （2）并列关系
3、标签的属性
用来设置标签的特征 字体、 颜色 、位置 、字号
标签的语法：<标签名 属性名1="属性值" 属性名2="属性值">内容</标签名>
4、基本标签
（1）标题标签
n的取值从1到6，数字越小字体越大，并且自动加粗、自动换行
<hn>内容</hn>
eg：
<h1>西安邮电大学</h1>
<h2>西安邮电大学</h2>
<h3>西安邮电大学</h3>
<h4>西安邮电大学</h4>
<h5>西安邮电大学</h5>
<h6>西安邮电大学</h6>
（2）段落标签
表示一段内容，可自动换行
<p aglin="对齐方式">段落文本</p>
eg：
<p>四大名著：</p>
<p>红楼梦</p>
（3）分割线
<hr color="水平线颜色" size="水平线粗细" width="水平线宽度，自适应为像素"/>
eg:
<hr color="red" size="5" width="400">
（4）换行标签
浏览器不识别回车换行符
<br/>
标题
（5）文本样式标签
html5以前的标签，以后可以通过CSS中实现这个功能 可以设置内容的字体大小、字体颜色、字形
<font size="字体大小" color="字体颜色" face="字形">内容</font>
eg：
<font size="45" color="red" face="隶书">四大美女：</font>
（6）文本格式化标签
字体加粗： <b>内容</b> <strong>内容</strong>
斜体：<i>内容</i> <em>内容</em>
下划线：<u>内容</u> <ins>内容</ins>
删除线：<s>内容</s> <del>内容</del>
（7）文本语义标签
高亮显示：<mark> 内容 </mark>
引用标签：<cite> 内容 </cite>
（8）特殊字符
（9）下标标签
<sub>内容</sub>
eg:
<h2>CO<sub>2</sub></h2>
（10）常见图像格式
GIF：支持动画，无损的图像格式，支持全透明或全不透明。
PNG：包括PNG-8和真彩色PNG(PNG-24和PNG-32)，相对于GIFPNG更小，支持alpha透明(全透明、半透明、全不透明)，不支持动画
JPG：有损压缩，意味每修改一次图片都会造成图像数据的丢失，图像体积很大，不适合于在互联网上传输。
（11）路径
相对路径：从文件当前位置开始的路径。
eg： demo/004.html
绝对路径：从磁盘根目录开始的路径。
eg： E:\deyun前端\2021-4-3\demo\004.html
反斜杠('')：在windows操作系统中以双反斜杠('\')作为路径分隔符
斜杆('/')：Linux操作系统下的路径分隔符
'./' ：当前目录(当前文件夹)
'../'：表示当前目录的上一级目录
（12）图像标签
<img src="路径" />
（13）超链接标签
文字超链接：
<a href="">文字</a>
图像超链接：
<a href="网页的地址" >
<img scr="图像名"/>
</a>
（14）滚动标签
图像滚动： direction属性表示滚动方向，取值有4个：left、right、up、down
behavior属性表示滚动的速度，数字越小速度越快
<marquee behavior="500" direction="down">
<img src="./images/7.png" width="500" height="280">
</marquee>
文字滚动：
<marquee behavior="500" direction="down">
<font color="" size="" face="">滚动的文字</font>
</marquee>
