w3c的出现为了制定网页开发的标准
网页由三部分组成：
结构（HTML）用于描述页面的结构
表现（CSS）用于控制页面中元素的样式
行为（JavaScript）用于响应用户操作
C/S：客户端/服务器
B/S：浏览器/服务器
B/S架构的软件，客户端和服务器之间通信采用的是通用的HTTP协议
HTML：超文本指的是超链接。HTML使用标签的形式来表示网页中的不同组成部分
<h1>......</h1> 一级标题
<h2>......</h2> 二级标题
<p>......</p> 段落
网页中有且只有一个根标签<html></html>，网页中所有内容要写在<html>......</html>里面
<html>
<head>
<title>标题写在这里</title>
</head>
<body>
<h1>这是我的第一个网页</h1>
</body>
</html>
head中写的东西在网页中不显示，是给浏览器或者搜索引擎看的
网页里的所有（用户）可见内容都应该写在body里面（h1,h2都是body的子元素）
<img>和<input>叫自结束标签：只有开始标签没有结束标签，也可以写成<img /><input />
注释 <!--..........................-->
注释不能嵌套
<font></font>字体
在标签中（开始标签或自结束标签）还可以设置属性，属性是一个名值对（x=y）
属性和标签名或其他属性应该使用空格隔开，属性值要使用引号引起来
color叫属性名，blue叫属性值
<html>
<head>
<title>第三个网页</title>
</head>
<body>
<h1>这是我的<font color="blue" size="1">第一个</font>网页</h1>
</body>
</html>
在网页中需要有文档声明（doctype），文档声明用来告诉浏览器当前网页的版本，且网页代码不区分大小写
<!doctype html> 写在网页最上面
meta标签用来设置网页的元数据，这里meta用来设置网页的字符集
标签 = 元素
字符集（charset）：编码和解码所采用的的规则
完整结构：
<!doctype html>
<html>
<head>
<meta charset="utf-8">
<title></title>
</head>
<body></body>
</html>
在网页中编写的多个空格默认情况会自动被浏览器解析为一个空格
如果我们需要在网页中书写这些特殊的符号，则需要使用html中的实体（转义字符）
实体的语法：
&实体的名字;
空格
> 大于号
< 小于号
© 版权符号
meta主要用于设置网页中的一些元数据，元数据不是给用户看。meta是自结束标签
charset指定网页的字符集
name指定的数据的名称
content指定的数据的内容
举例京东：
<meta name="111" content="网上购物,网上商城,手机,笔记本,电脑,MP3,CD,VCD,DV,相机,数码,配件,手表,存储卡,京东"/>
<meta name="222" content="网上购物,网上商城,手机,笔记本,电脑,MP3,CD,VCD,DV,相机,数码,配件,手表,存储卡,京东"/>
111表示网站的关键字，可以同时指定多个关键字，关键字间使用,隔开
222用于指定网站的描述，网站的描述会显示在搜索引擎的搜索的结果中
title标签的内容会作为搜索结果的超链接上的文字显示
<meta http-equiv="refresh" content="3;url=https://www.4399.com">
将页面重定向到另一个网站：3秒后跳转到4399.
语义化标签
在网页中HTML专门用来负责网页的结构，所以在使用html标签时，应该关注的是标签的语义而不是他的样式
在页面中独占一行的元素称为块元素（block element），标题标签都是块元素
p标签标示页面中的一个段落（p也是一个块元素）
br标签标示页面中的换行
hr标签：水平线分隔
hgroup标签用来为标题分组，可以将一组相关的标题同时放入到hgroup
em标签用于标示语音语调的一个加重
在页面中不会独占一行的元素称为行内元素（inline element）
strong标示强调，重要内容
blockquote 表示一个长引用
q表示一个短引用
block element 块元素：在网页中一般通过块元素对页面布局，一般情况下会在块元素中放行内元素，块元素中基本上什么都能放
inline element 行内元素：主要用来包裹文字
p元素中不能放任何块元素
浏览器在解析网页时，会自动对网页中不符合规范的内容进行修正
例如：标签写在了根元素的外部、p元素中嵌套了块元素、根元素中出现了除head和body以外的元素
查看纠正后的代码：F12 Elements的作用：显示网页在内存中的结构（查看网页中的源码）
块元素
布局标签（结构化语义标签 ）
header表示网页的头部 <header></header>
main表示网页的主体部分（一个页面中只会有一个main） <main></main>
footer表示网页的底部 <footer></footer>
nav表示网页中的导航
aside和主体相关的其他内容（侧边栏）
article表示一个独立的文章
section表示一个独立的区块，上边的标签都不能表示时使用section
div 没有语义，就用来表示一个区块，目前来讲div还是我们主要的布局元素
span 行内元素，没有任何语义，一般用于在网页中选中文字
19.列表
1.铅笔
2.尺子
3.橡皮
在html中也可以创建列表，html列表一共有三种：
1.有序列表
2.无序列表
3.定义列表
有序列表->使用ol标签来创建无序列表，使用li表示列表项
无序列表->使用ul标签来创建无序列表，使用li表示列表项
定义列表->使用dt来表示定义的内容，使用dd来对内容进行解释说明
列表之间可以互相嵌套
20.超链接
使用 a 标签来定义超链接<a>......</a>
超链接也是一个行内元素，在a标签中可以嵌套除它自身外的任何元素
属性：
href指向链接跳转的目标地址
<a>超链接</a>
<br></br>
<a>超链接</a>
<a href="07.列表.html">超链接2</a>
当我们需要跳转一个服务器内部的页面时，一般我们都会使用相对路径
相对路径都会使用.或..开头
./
../
./可以省略不写，如果不写./也不写../则就相当于写了./
./表示当前文件所在目录
target属性，用来指定超链接打开的位置
可选值：
_self （默认）在当前页面中打开超链接
_blank 在一个新的页面中打开超链接
可以设置一个内敛框架的name属性值，链接将会在指定的内嵌框架中打开
比如：
<a href="demo03.html" target="tom">我是一个超链接</a>
举例：
<a href="07.列表.html" target="blank">超链接</a>
回到顶部：可以直接将超链接的href属性设置为#，这样点击超链接以后页面不会发生跳转，而是转到当前页面
<a id="bottom" href="#">回到顶部</a>
id属性：唯一不重复
每一个标签都可以添加一个id属性
id属性就是元素的唯一标识，同一个页面中不能出现重复的id属性
向指定页面跳转
<a href="#p3">去第三个自然段</a>
<p>11111</p>
<p>22222</p>
<p id="p3">33333</p>
在开发中可以将#作为超链接的路径的占位符使用
可以使用javascript:;作为href的属性，此时点击这个超链接什么也不会发生
<a href="javascript:;">这是一个新的超链接</a>
点击链接发送邮件：
<a href="mailto:abc@alipay.com">联系我们</a>
23 图片标签
图片标签用于向当前页面中引入一个外部图片
使用img标签来引入外部图片，img标签是自结束标签
属性：
src属性指定的是外部图片的路径（路径规则和超链接是一样的）
alt是图片的描述，这个描述默认情况下不会显示，有些浏览器会在图片无法加载时显示
<img src="./img/1.gif">
引入外部图片：复制图片地址，如上
<img src="" alt="">
搜索引擎会根据alt中的内容来识别图片，如果不写alt属性则图片不会被搜索引擎所收录
width 图片的宽度（单位是像素）
height 图片的高度
宽度和高度中如果只修改了一个，则另一个会等比例缩放
注意：一般情况在pc端，不建议修改图片的大小，需要多大的图片就裁多大
但是在移动端，经常需要对图片进行缩放
内联框架->用于向当前页面中引入一个其他页面（开发中不推荐使用内联框架，内联框架里的内容不会被搜索引擎读取到）
src指定要引入的网页的路径
<iframe src="" frameborder="0"></iframe>
<iframe src="https://www.qq.com" name = "what the fuck?" width="800" height="600" frameborder="0"></iframe>
src->指定要引入的网页的路径
frameborder->内联框架的边框
替换元素有 audio img
<audio src=""></audio>
src->指定引入文件的路径，音视频文件引入时，默认情况下不允许用户自己控制播放停止
controls 是否允许用户控制播放
autoplay 音频文件是否自动播放
loop 音乐是否循环播放
除了通过src指定外部路径外，还可以通过source来指定文件
<audio src="./source/audio.mp3" controls autoplay loop></audio>
=<source src="./source/audio.mp3">
使用video标签来向网页中引入一个视频，使用方式和audio基本上是一样的
<video controls>
<source src="./source/flower.mp4">
