一、网页基本结构
<!DOCTYPE html><!--声明这是一个html文档 -->
<html><!-- 根标签 -->
<head><!-- 头部标签 -->
<meta charset="utf-8"><!-- charset设置字符集 utf-8:万国码 -->
<title></title><!-- 页面标题 -->
</head>
<body><!-- 内容 -->
</body>
</html>学习html标签的原则：关注语义，不关注样式位置 -->
标签 又叫元素 分为单标签和双标签
双标签 有开始标签和结束标签 写在标签内，就是在开始标签和结束标签中间
html 根标签 一个页面只有一个根标签，所有的内容都要写在根标签内-->
<html>head标签 里面内容，用户是看不到的，给浏览器看的，可以辅助浏览器
来解析代码
<head>title标签 网页的标题 出现在网页标题栏中
title更重要的作用是一定程度上帮助浏览器检索页面，帮助推广部门推广网站
推广部门一般情况下分为SEM、SEO两 个部分，SEM主要做竞价推广，
SEO是做搜索引擎优化，不花钱推广
<title >网页的标题111</title>
meta 单标签 两种写法 <meta> 或<meta />
主要是配合属性以及对应的属性值，来帮助浏览器解析代码
例如：charset="属性值"，name='',content=''
属性 写在开始标签或者单标签里面
属性值 写在属性后，双引号内部
charset属性 字符集属性 用来设置密码本
utf-8属性值 字符集的种类 万国码
GB 国标
GBK 国标扩展版
编码 也就是将字符、图片、音视频等都转成二进制存起来
解码 将存起来的二进制转成字符、图片、音视频
乱码 编码和解码用的不是一套密码本，就出现乱码
注：网页基本结构也可以通过快捷方式 ！(英文状态下)+enter 直接生成
<!DOCTYPE html>
<!-- lang="en" 配置代码语言是英文 -->
<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>二、实体
在浏览器中，有一些特殊的符号，浏览器提前征用，程序员不可以直接去使用，浏览器是不识别的
如果非要用，程序员需要用另外的一些字符去替代，我们管这些另外的字符就叫实体
常见的实体包括：
空格
> 大于号
< 小于号
© ©️
三、常用标签
标题标签h1 ~ h6 语义：用标题标签包裹的内容就是标题
段落标签p 语义：段落标签用于表示内容中的一个自然段
hgroup标签用来为标题分组，可以将一组相关的标题同时放入到hgroup
em标签 语义：语音语调的一个加重强调
strong 语义：表示强调，内容重要性强调
blockquote 引用别人说的话 长引用 会换行
div 布局的没有意义的元素/标签
span 没有任何语义
四、标签的分类
元素又叫标签，元素的分类
块元素 主要是用来布局
特点：
1、会独占一行
2、块元素宽度默认是父元素的100%，如果你设置宽高，你设置多少就是多少
3、块元素高度默认是被内容撑开的
常用的块元素：h1-h6,p,div,header,main,footer,nav,·····
行内元素 主要是用来包裹文字的
特点：
1、不会独占一行
2、行内元素的宽高都是被内容撑开的，不可以自定义宽高
常用的行内元素：span、em、strong、a·····
行内块元素 目前主要用的行内块元素就是图片标签
特点：
1、即有块元素的特点又有行内元素的特点
不会独占一行，但可以设置宽高
display 实现不同元素的相互转换
可选值：
none 隐藏元素
block 转成块元素
inline 转成行内元素
inline-block 转成行内块元素
使用块元素和行内元素布局时注意点：
1、块元素是布局元素，里面什么都能放，能放块元素，能放行内元素，行内块元素
2、行内元素 一般就用来包裹文字 ，里面不能放块元素
3、特殊的块元素 p 不能放块元素，只能放文字或者图片
4、特殊的行内元素 a 里面什么都能放，除了它自己
