前言

换工作来到这个公司似乎也差不多超过三个月了，经历了不少也看清了自己的很多的不足之处在哪里。由最开始没信心胜任写下H5页面的终日抱怨害怕退缩的小孩子走到了现在懵懵懂懂理解Html5是何物，真是经历了很多，也学习了很多。

---

Html5 是什么？

在学习一样东西之前，我们必须要理解它的本质是什么，不然哪怕你学习了你觉得你懂了但是别人问你H5是什么，和Java又有什么区别的时候，你哑口无言，多尴尬。

HTML5 是第五代HTML协议，简称 H5。它和HTML一样，都是一种超文本标记语言。

可能你就会着急了，不对啊，Html5不是说功能很强大可以更加酷炫什么的，那单纯利用H5的话你写出的效果没有那么好看啊，但是你先别急，如果用HBuilder写过App项目或者Web项目你就不会奇怪了，你可以很明显看到他们的分包。

Hbulider分包
（哎呀，才玩简书不久所以自己截图什么的感觉不会好low哦），你可以看到他左边的项目分包下显示分别 css 、img、js三个项目包名，其实里面分别存放的就是你的CSS样式、图片资源、 js文件， 还有就是最外层的html文件。是不是很熟悉，对，其实完整的H5不只是包含html文件，它也包括了最新的CSS3 js实现的逻辑 还有你项目所需要的资源等等。

HTML5 中包含了javascript、css、文件项目资源与html文件。

浅析剥识H5

• html文件是什么？

我们一个一个来，不着急。如果把H5比喻为一个人，那么按照我的理解来说html文件就是这个人的外表，好不好看长的怎么样就看你html文件的构造了。也就是说一个我们看到的界面其实就是html文件的内容。

• css文件的是什么？作用又是什么？

既然将html比喻是一个人，那么css我们可以说为是这个人身上的修饰装饰，你想啊，一个人光溜溜的是不是很难看，（当然，那个美女我是不觉得难看的【色色的脸】），所以我们就有了打扮，衣服裙子化妆品什么之类的为了让自己更好看，人都是那么程序肯定也是啦。

• img文件

这个不用我说了吧，如果你不知道的话额，你看看太阳，是不是世界末日要来了。

• js文件

人如果只有了光鲜的外表那么我想人类早在三亿年前就灭绝了吧？因为人要吃饭要思考要有心跳才是真的在活着啊不是么？那么就js的作用就呼之欲出了，对，你要在javascript中写你这个程序的逻辑代码，你想让他怎么跑怎么得到数据怎么变化。人生，是自己决定的。程序，也是你决定的。

下面安利一个好东西，想要学习的可以去下面的网站学习，没有什么是做不到的，更多的是你是否相信你自己。

W3School传送门（点我穿越）

---

因为标签实在太多了，我在后面就不会介绍标签了，但是还是要记住一些常用的比如说 div、span、canvas、ul、li、p、h1~h6···等等，我们可以通过去上面的链接中去学习一个标签的特性，这样可以让你在写界面的结构时事半功倍。

下一篇文章我会写到html自上而下的文档结构，理解了html的文档结构后能让你对H5页面构成有更深入的了解。期待我的下次写作吧。

如果你觉得这篇文章对你有用，那么请不要吝啬你的喜欢哦，你的喜欢就是我写作的动力。如果你觉得你希望转载，欢迎你的转载。

当人相信自己可以行的时候，那么我相信他，一定行。勉励之。