用了一些时间断断续续学习前端，初学不久，在这里分享一些对前端的认识。帮助自己梳理思路的同时，也希望能帮助到有兴趣的人。

介绍

Web前端，通俗的说就是平时我们看到的各种浏览器中展示给我们的页面。

• 简单的页面，比如在微信公众号里面的文章，一篇文章就是一个页面，虽然简单，但是这种页面的重点是给读者显示有价值的文章。
• 复杂的页面，比如打开淘宝、天猫、京东等网站的页面，由很多东西组成，很复杂，页面制作也比较麻烦。

做设计的人可以先利用设计工具设计出好看好用的模型，然而这些模型如果仅仅由设计师才能欣赏，那受众就太小了，设计中的基本上所有元素都可以由前端实现，借助互联网，将页面展示给所有可用使用互联网的人。

任何工具的作用都有很多，前端也是一个工具，它不仅仅是显示信息，还可用作工作岗位，锻炼我们的思考方式等等。并且，对我而言，前端还可以是一种创作的工具，利用它来实现脑袋中的各种创意。它有多少作用，还需要去不断学习，不断的探索。

结构

前端从大的方面来看，就是html,css，JavaScript组合而成。使用这三者可以做出任何页面。这三者是前端的基础，无论以后学什么东西，这三者都是必须要懂的。

对于一个网页，HTML定义网页的结构，CSS描述网页的样子，JavaScript设置行为。一个很经典的例子是说HTML就像 一个人的骨骼、器官，而CSS就是人的皮肤，有了这两样也就构成了一个植物人了，加上javascript这个植物人就可以对外界刺激做出反应，可以思考、运动、可以给自己整容化妆（改变CSS）等等，成为一个活生生的人。

HTML

html：超文本标记语言，可以指定网页的head、body以及里面的内容。其中“head”部提供关于网页的信息，“body”部分提供网页的具体内容。head内部和body内部都有很多其他的标签可以使用，便于我们阅读。

一些简答的html页面如下

简单的html页面

复杂的html页面，比如简书的页面，可以看到里面html的标签有很多，这里只截取了head标签的内容，body还有很多内容

简书的页面

重点：html主要是知道标签代表的意思，标签在页面中放在哪个位置合适，可以多看一些页面的代码来熟悉。

CSS

层叠样式表(英文全称：Cascading Style Sheets)是一种用来表现HTML（标准通用标记语言的一个应用）或XML（标准通用标记语言的一个子集）等文件样式的计算机语言。CSS不仅可以静态地修饰网页，还可以配合各种脚本语言动态地对网页各元素进行格式化。

CSS作为皮肤，修饰html页面的样式，css可以指定网页的样子。

我们可以理解为，html是一个没有穿衣服的人，人没有穿衣服就不好看(在公共场合不好看)，CSS是衣服，衣服有各种各样，同一个人身上可以穿不同种类的衣服，最后显示不同的样子。也就是CSS的样式不同，作用在HTML身上之后网页的效果就不一样。

CSS主要功能就是给HTML页面添加样式，有了HTML和CSS就可以做出好看的页面了。

CSS演示

在HTML的img标签上加了一些样式，宽度，高度，边框等等。一些细节的用法，需要多看，多练习，才能记住。

CSS语法

CSS文件的内容一般都是如下所示。

一般CSS的长相

JavaScript

JavaScript可以说是前端的灵魂。有了JavaScript，页面就可以做出动态交互，登录页面的时候，JavaScript会向其它计算机通过网络发送我们输入的数据。

总结

html和css主要是记忆类型的东西偏多，需要多写几个页面，参考别人的页面，心中大致知道html大致css的用法，并在遗忘的时候能快速找到方法，最终熟练运用。

JavaScript作为一门独立的语言，功能也很强大。大神们推荐看《JavaScript DOM编程艺术》。

学习网站

在学习的过程中，头脑有时候记不了那么多的东西，留一些网站作为参考。

W3School，有中文的有英文的，基本上涵盖了前端的所有知识点，这一个网站基本就够用的了。

学习CSS布局
SitePoint ，里面很多优质的英文前端文章
CSS Tricks，很多优质的CSS文章
CSS 禅意花园，我还没有看过

最后

我目前学习的时候，先看W3School的一些文章参考，到一些网络课堂上搜一些视频看，边学边做。
等到HTML和CSS学扎实了以后，再学习JavaScript。学习的时候也可以多看一些感兴趣的网站，直接打开浏览器的开发者控制台，然后看页面的代码内容，最后在自己练习。

还有很多不完善的地方，请多多指教，多多指出问题。