上一期带大家简单的了解了关于html的知识和特性，大家对html有了初步的了解。
这一期我们主要围绕着3点来展开
1.让我们简单膜拜一下别人的页面以及简单的了解一下浏览器
2.让我们开始搭建一个简单的html页面
3.简单的认识一下什么是行内元素？什么是块级元素？
第一部分，首先咱们先找个大家经常浏览的页面： www.baidu.com/
打开页面并且单机右键单击检查打开控制台
然后你会在又边栏里面看到了一切在浏览度娘的时候从来没有注意到的一个东西，而且貌似还挺复杂，不过不着急，这个东西几乎要伴随咱们整个程序员生涯
在你们走神看控制台的彩蛋的时候别忘了我们的目的是去浏览这个页面的结构，下面单击一下控制台左上角的Elements
我们就可以看到这个页面html结构和css样式信息
左边的边框里面是它的html结构，有面的是他的css信息，无论页面有多么的复杂（或者多么的简单）这两个要素是构成页面必不可少的就像我之前说的，html是骨骼而css是依附在骨骼上的皮肉。
我们从页面html结构上可以看到这个页面看上去很简单但是其实并不简单貌似结构还挺复杂的，是有很多的“盒子”构成的，我们把这个叫做“标签”。
把鼠标移动到了某个标签会显示页面上对应该区域的模块并且会显示它的宽高等简单的信息。
但是有没有发现有几个比较特殊的标签，把鼠标移动到上面的时候貌似没有对应到页面上任何一个元素。
head和script标签是什么东西，难道它在页面上没有任何用处么？
让我们点开head标签看一下
我们可以看到head标签里面还有其他的标签 title标签顾名思义是标题，那我们把里面的文案改一下看看有什么变化
哇塞！对应着的页面的标题也会改变了！但是我们再次打开这个页面却什么都没变，从上面的操作我们可以得知：
A）html结构是有不同的标签构成的，而且标签里面可以嵌套小标签
B）控制台可以看到页面实时的html结构和css样式，并且可以被“暂时”更改方便开发者观察效果
第二部分，那么我们说了这么多同学们有没有想要跃跃欲试开始打造自己的第一个页面了呢？那么打开你的记事本
没错就是它
然后在里面写一行代码
OK保存关闭，把txt文件的扩展名改成html
然后文件的图标会改变，别担心这是正常现象，而且你有没有发现这个图标有些熟悉，双击打开它！
你的第一个页面就产生啦!那么让我们打开控制台看一下你写的代码都生成了什么
怎么样，所见即所得，是不是很简单呢？但是真正在工作中当然不会使用记事本这种工具去敲代码，我推荐的编码工具是VSCODE或者HBUILDER，都2019年了就不要再提Dreamweaver了。
第三部分，这一部分主要是想给学生们介绍一下标签大体的分类以及特点，大家还记得标签是什么么?就是组成你的一个一个的小“模块”。
经过刚才的尝试大家大概可以发现标签有这几个特征：
1.标签大部分是成对出现的，但是也是可以不成对出现
2.标签是不区分大小写的
3.标签要闭合否则页面会出错，尤其在不成对出现的时候
一个标签在页面上会生成一块对应的“元素”。一共分为三大类：
1.行内元素
2.块级元素
3.行内块元素
那么他们都有什么区别呢？
行内元素的代表span，让我们来试试先
多写两个试试
那么我们在加上一个块级元素试一下（div）
那个“i am div”掉下来了！那么我多写几个div
运行一下试试
每一个块级元素单独占一行，而行内元素可以多个在一行之内展示，在一行放不开的情况下才会分行
